Column
10 Oct 20255 minutes to read
Represents the “Column” model class for TreeGrid, defining essential properties and functionalities of a column.
Properties
allowEditing boolean
Allows or disallows editing of the column. Set to false to make a column non-editable.
By default, all columns are editable.
Defaults to true
allowFiltering boolean
Disables filtering for the column if set to false. By default, columns are filterable.
Defaults to true
allowReordering boolean
Disables column reordering if set to false. By default, columns can be reordered.
Defaults to true
allowResizing boolean
Disables resizing for the column if set to false. By default, columns can be resized.
Defaults to true
allowSorting boolean
Disables sorting for the column if set to false. By default, columns are sortable.
Defaults to true
clipMode ClipMode
Sets how cell content should overflow:
-
Clip- Truncates overflow content. -
Ellipsis- Shows ellipsis for overflow content. -
EllipsisWithTooltip- Shows ellipsis with a tooltip on hover when content overflows.
Defaults to Ellipsis
columns Column[]|string[]|ColumnModel[]
Facilitates multiple header rows (stacked headers) in the TreeGrid header.
Defaults to null
commands CommandModel[]
Options for displaying command buttons in each column cell.
Built-in options include:
- Edit - Modify the record.
- Delete - Remove the record.
- Save - Preserve changes to the record.
- Cancel - Undo changes.
Defaults to null
customAttributes { : }
Custom styles and attributes for the content cells of the column.
Defaults to null
defaultValue string
Default value to use when adding a new record to the TreeGrid.
Defaults to null
disableHtmlEncode boolean
When set to true, encodes HTML content in headers and cells to prevent HTML injection.
Defaults to true
displayAsCheckBox boolean
Displays column values as checkboxes if set to true, instead of Boolean values.
Defaults to false
edit IEditCell
Customization options for the edit cell.
Defaults to {}
editTemplate string|Function
Template for the cell editor of this column, either as a string or an HTML element ID.
Defaults to null
editType string
Defines the editor type for the column.
Defaults to ‘stringedit’
field string
Maps the column to a specific field name in the data source.
Columns with a defined field can be used for sorting, filtering, etc.
The field name should conform to valid JavaScript identifiers - starting with an alphabet, avoiding spaces and special characters.
Defaults to ‘undefined’
filter IFilter
Customize default filter options for a specific column, providing types and UI definitions for custom components.
Defaults to null
filterBarTemplate IFilterUI
Replaces the default input component for the filter bar with a custom component. Contains create and read functions for component management.
Defaults to null
filterTemplate string|Function
Filter template/UI for the column, either as a string or an HTML element ID.
Defaults to null
format string|NumberFormatOptions|DateFormatOptions
Allows display format customization, affecting only the display, not the actual data.
Supported format options for numbers and dates can be provided.
References for number
and date formats.
Defaults to null
formatter Object|ITreeGridCellFormatter|Function
Method for applying custom formatting to cell content prior to rendering.
Defaults to null
freeze freezeDirection
Dictates the column freeze position. Options include:
-
Left- Freeze the column on the left. -
Right- Freeze the column on the right. -
Fixed- Freeze the column in the center.
Defaults to null
headerTemplate string|Function
Template for a customized header element, either as a string or an HTML element ID.
Defaults to null
headerText string
Specifies the text displayed in the column header. If not provided, the field value will be used.
Defaults to ‘undefined’
headerTextAlign TextAlign
Text alignment specifically for the column header.
Defaults to null
hideAtMedia string
Adjusts column visibility based on Media Queries. Accepts valid media query strings.
Defaults to ‘undefined’
isFrozen boolean
Freezes the column if set to true.
Defaults to false
isIdentity boolean
Marks the column as an identity column if set to true.
Defaults to false
isPrimaryKey boolean
Designates this column as a primary key if set to true.
Defaults to false
lockColumn boolean
Locks the column to its position, preventing reordering, if set to true. Locked columns appear first.
Defaults to false
maxWidth string|number
Maximum width of the column in pixels or percentage, preventing resizing beyond this value.
Defaults to ‘undefined’
minWidth string|number
Minimum width of the column in pixels or percentage.
Defaults to ‘undefined’
showCheckbox boolean
When set to true, checkboxes are displayed within the column.
Defaults to false
showColumnMenu boolean
Disables column menu for the column if set to false. By default, column menus are enabled for all columns.
Defaults to true
showInColumnChooser boolean
Excludes the column from the column chooser if set to false. By default, columns are included.
Defaults to true
sortComparer SortComparer|string
Custom sort comparer function for the column. Similar to the Array.sort comparer function.
template string|Function
Custom element rendering in each column cell. Accepts template strings or HTML element IDs.
Defaults to null
textAlign TextAlign
Alignment for the text in both header and content cells.
Defaults to Left
type string
Specifies the data type of the column.
Defaults to null
uid string
Unique identifier for the column, used to reference the column object.
Defaults to ‘undefined’
validationRules Object
Rules for validating data during creation and updation.
Defaults to null
valueAccessor ValueAccessor|string
Method for customizing cell values using an external function, applied during cell rendering.
Defaults to null
visible boolean
Determines column visibility. When set to false, the column is hidden. By default, columns are visible.
Defaults to true
width string|number
Specifies the column width in pixels or percentage.
Defaults to ‘undefined’