SpanColumnComponent
Represents a column that spans multiple data cells while keeping individual header and footer cells.
Use this component to create flexible layouts and retain built-in UI for sorting and filtering.
Wrap the columns to merge inside the <kendo-treelist-span-column>
tag.
<kendo-treelist-span-column>
<kendo-treelist-column field="field1"></kendo-treelist-column>
<kendo-treelist-column field="field2"></kendo-treelist-column>
<ng-template kendoTreeListCellTemplate let-dataItem>
<h5>{{ dataItem.field1 }}</h5>
<p>{{ dataItem.field2 }}</p>
</ng-template>
</kendo-treelist-span-column>
Selector
kendo-treelist-span-column
Inputs
Name | Type | Default | Description |
---|---|---|---|
autoSize |
|
Indicates whether the column is automatically resized during initialization to fit its header and row content. | |
columnMenu |
|
|
Specifies if the column menu is shown for the column. |
class |
|
Sets custom CSS classes to the column cells. Uses the | |
editable |
|
|
Defines whether the edit template of the column is rendered. To enable editing for a spanned column, set an edit template for it. |
expandable |
|
Specifies if the expanded indicator appears in the column. | |
hidden |
|
|
Sets the visibility of the column (see example). |
lockable |
|
|
Specifies if the column can be locked or unlocked from the column menu or by reordering the columns. |
locked |
|
|
Toggles the locked (frozen) state of the columns. Locked columns are visible at all times during horizontal scrolling. See example. |
media |
|
Sets the condition that must be satisfied for a column to remain visible (see example).
If you set the | |
minResizableWidth |
|
|
Sets the minimum width (in pixels) for resizing the column using the UI. |
reorderable |
|
|
Indicates whether the column is reorderable. |
resizable |
|
|
Indicates whether the column is resizable. |
style |
|
Sets custom styles for the table cells (excluding the footer and header) of the column. Uses the | |
tableCellsRole |
|
|
Sets the |
Fields
Name | Type | Default | Description |
---|---|---|---|
orderIndex |
|
|
The column index after reordering. The orderIndex` is a read-only property. Setting this field does not affect column order. |