Column API in JavaScript (ES5) TreeGrid API control

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’