<kendo:treeList-column>

The configuration of the treelist columns. An array of JavaScript objects or strings. JavaScript objects are interpreted as column configurations. Strings are interpreted as thefield to which the column is bound. The treelist will create a column for every item of the array.

Example

<kendo:treeList-columns>
    <kendo:treeList-column></kendo:treeList-column>
</kendo:treeList-columns>

Configuration Attributes

attributes java.lang.Object

HTML attributes of the table cell (

) rendered for the column.

Example

<kendo:treeList-column attributes="attributes">
</kendo:treeList-column>

editor java.lang.String

Provides a way to specify a custom editing UI for the column. Use the container parameter to create the editing UI.

Example

<kendo:treeList-column editor="editor">
</kendo:treeList-column>

encoded boolean

If set to true the column value will be HTML-encoded before it is displayed. If set to false the column value will be displayed as is. By default the column value is HTML-encoded.

Example

<kendo:treeList-column encoded="encoded">
</kendo:treeList-column>

expandable boolean

If set to true the column will show the icons that are used for expanding and collapsing child rows. By default, the first column of the TreeList is expandable.

Example

<kendo:treeList-column expandable="expandable">
</kendo:treeList-column>

field java.lang.String

The field to which the column is bound. The value of this field is displayed by the column during data binding.The field name should be a valid Javascript identifier and should contain no spaces, no special characters, and the first character should be a letter.

Example

<kendo:treeList-column field="field">
</kendo:treeList-column>

filterable boolean

If set to true a filter menu will be displayed for this column when filtering is enabled. If set to false the filter menu will not be displayed. By default a filter menu is displayed for all columns when filtering is enabled via the filterable option.Can be set to a JavaScript object which represents the filter menu configuration. Further configuration is available via kendo:treeList-column-filterable.

Example

<kendo:treeList-column filterable="filterable">
</kendo:treeList-column>

footerTemplate java.lang.String

The template which renders the footer table cell for the column.The fields which can be used in the template are: average - the value of the "average" aggregate (if specified); count - the value of the "count" aggregate (if specified); max - the value of the "max" aggregate (if specified); min - the value of the "min" aggregate (if specified) or sum - the value of the "sum" aggregate (if specified).

Example

<kendo:treeList-column footerTemplate="footerTemplate">
</kendo:treeList-column>

format java.lang.String

The format that is applied to the value before it is displayed. Takes the form "{0:format}" where "format" is a standard number format,custom number format, standard date format or a custom date format.

Example

<kendo:treeList-column format="format">
</kendo:treeList-column>

headerAttributes java.lang.Object

HTML attributes of the table header cell (

) rendered for the column.

Example

<kendo:treeList-column headerAttributes="headerAttributes">
</kendo:treeList-column>

headerTemplate java.lang.String

The template which renders the column header content. By default the value of the title column option is displayed in the column header cell.

Example

<kendo:treeList-column headerTemplate="headerTemplate">
</kendo:treeList-column>

hidden boolean

If set to true the column will not be displayed in the treelist. By default all columns are displayed.

Example

<kendo:treeList-column hidden="hidden">
</kendo:treeList-column>

lockable boolean

If set to false the column will remain in the side of the treelist into which its own locked configuration placed it.

Example

<kendo:treeList-column lockable="lockable">
</kendo:treeList-column>

locked boolean

If set to true the column will be displayed as locked (frozen) in the treelist. Also see the information about Frozen Columns in the Grid Appearance article.

Example

<kendo:treeList-column locked="locked">
</kendo:treeList-column>

If set to true the column will be visible in the grid column menu. By default the column menu includes all data-bound columns (ones that have their field set).

Example

<kendo:treeList-column menu="menu">
</kendo:treeList-column>

minScreenWidth float

The pixel screen width below which the column will be hidden. The setting takes precedence over the hidden setting, so the two should not be used at the same time.

Example

<kendo:treeList-column minScreenWidth="minScreenWidth">
</kendo:treeList-column>

sortable boolean

If set to true the user can click the column header and sort the treelist by the column field when sorting is enabled. If set to false sorting will be disabled for this column. By default all columns are sortable if sorting is enabled via the sortable option. Further configuration is available via kendo:treeList-column-sortable.

Example

<kendo:treeList-column sortable="sortable">
</kendo:treeList-column>

template java.lang.String

The template which renders the column content. The treelist renders table rows (

) which represent the data source items. Each table row consists of table cells () which represent the treelist columns. By default the HTML-encoded value of the field is displayed in the column.

Example

<kendo:treeList-column template="template">
</kendo:treeList-column>

title java.lang.String

The text that is displayed in the column header cell. If not set the field is used.

Example

<kendo:treeList-column title="title">
</kendo:treeList-column>

width java.lang.Object

The width of the column. Numeric values are treated as pixels. For more important information, please refer to Column Widths.

Example

<kendo:treeList-column width="width">
</kendo:treeList-column>

Configuration JSP Tags

kendo:treeList-column-command

The configuration of the column command(s). If set the column would display a button for every command. Commands can be custom or built-in ("edit", "createChild" or "destroy"): The "edit" built-in command switches the current table row to edit mode.; The "createChild" built-in command adds a new child item to the current table row and switches to edit mode. or The "destroy" built-in command removes the data item to which the current table row is bound.. Custom commands are supported by specifying the click option.

More documentation is available at kendo:treeList-column-command.

Example

<kendo:treeList-column>
    <kendo:treeList-column-command></kendo:treeList-column-command>
</kendo:treeList-column>

kendo:treeList-column-filterable

If set to true a filter menu will be displayed for this column when filtering is enabled. If set to false the filter menu will not be displayed. By default a filter menu is displayed for all columns when filtering is enabled via the filterable option.Can be set to a JavaScript object which represents the filter menu configuration.

More documentation is available at kendo:treeList-column-filterable.

Example

<kendo:treeList-column>
    <kendo:treeList-column-filterable></kendo:treeList-column-filterable>
</kendo:treeList-column>

kendo:treeList-column-sortable

If set to true the user can click the column header and sort the treelist by the column field when sorting is enabled. If set to false sorting will be disabled for this column. By default all columns are sortable if sorting is enabled via the sortable option.

More documentation is available at kendo:treeList-column-sortable.

Example

<kendo:treeList-column>
    <kendo:treeList-column-sortable></kendo:treeList-column-sortable>
</kendo:treeList-column>

Event Attributes

editor String

Provides a way to specify a custom editing UI for the column. Use the container parameter to create the editing UI.

Example

<kendo:treeList-column editor="handle_editor">
</kendo:treeList-column>
<script>
    function handle_editor(e) {
        // Code to handle the editor event.
    }
</script>

footerTemplate String

The template which renders the footer table cell for the column.The fields which can be used in the template are: average - the value of the "average" aggregate (if specified); count - the value of the "count" aggregate (if specified); max - the value of the "max" aggregate (if specified); min - the value of the "min" aggregate (if specified) or sum - the value of the "sum" aggregate (if specified).

Example

<kendo:treeList-column footerTemplate="handle_footerTemplate">
</kendo:treeList-column>
<script>
    function handle_footerTemplate(e) {
        // Code to handle the footerTemplate event.
    }
</script>

headerTemplate String

The template which renders the column header content. By default the value of the title column option is displayed in the column header cell.

Example

<kendo:treeList-column headerTemplate="handle_headerTemplate">
</kendo:treeList-column>
<script>
    function handle_headerTemplate(e) {
        // Code to handle the headerTemplate event.
    }
</script>

template String

The template which renders the column content. The treelist renders table rows (

) which represent the data source items. Each table row consists of table cells () which represent the treelist columns. By default the HTML-encoded value of the field is displayed in the column.

Example

<kendo:treeList-column template="handle_template">
</kendo:treeList-column>
<script>
    function handle_template(e) {
        // Code to handle the template event.
    }
</script>

Event Tags

kendo:treeList-column-editor

Provides a way to specify a custom editing UI for the column. Use the container parameter to create the editing UI.

Example

<kendo:treeList-column>
    <kendo:treeList-column-editor>
        <script>
            function(e) {
                // Code to handle the editor event.
            }
        </script>
    </kendo:treeList-column-editor>
</kendo:treeList-column>

kendo:treeList-column-footerTemplate

The template which renders the footer table cell for the column.The fields which can be used in the template are: average - the value of the "average" aggregate (if specified); count - the value of the "count" aggregate (if specified); max - the value of the "max" aggregate (if specified); min - the value of the "min" aggregate (if specified) or sum - the value of the "sum" aggregate (if specified).

Example

<kendo:treeList-column>
    <kendo:treeList-column-footerTemplate>
        <script>
            function(e) {
                // Code to handle the footerTemplate event.
            }
        </script>
    </kendo:treeList-column-footerTemplate>
</kendo:treeList-column>

kendo:treeList-column-headerTemplate

The template which renders the column header content. By default the value of the title column option is displayed in the column header cell.

Example

<kendo:treeList-column>
    <kendo:treeList-column-headerTemplate>
        <script>
            function(e) {
                // Code to handle the headerTemplate event.
            }
        </script>
    </kendo:treeList-column-headerTemplate>
</kendo:treeList-column>

kendo:treeList-column-template

The template which renders the column content. The treelist renders table rows (

) which represent the data source items. Each table row consists of table cells () which represent the treelist columns. By default the HTML-encoded value of the field is displayed in the column.

Example

<kendo:treeList-column>
    <kendo:treeList-column-template>
        <script>
            function(e) {
                // Code to handle the template event.
            }
        </script>
    </kendo:treeList-column-template>
</kendo:treeList-column>
Is this article helpful? Yes / No
Thank you for your feedback!

Give article feedback

Tell us how we can improve this article

close
Dummy