Specifies a set of cell components that the Grid will render instead of the built-in cell.
<GridColumn cells={{ data: CustomDataCell }} />
children?
GridColumnProps[] | ReactElement<GridColumnProps>[] | GridColumnChildrenProps[]
A collection of child columns.
<GridColumn>
<GridColumn field="child1" />
<GridColumn field="child2" />
</GridColumn>
className?
string
Sets the custom CSS classes to the column cells.
colSpan?
number | (colSpanProps: GridColSpanProps) => number
1
Sets the colSpan of the column which will make the row content span over multiple cells. As arguments, it takes either a number or a function that returns a number.
<GridColumn colSpan={2} />
columnMenu?
React.ComponentType<GridColumnMenuProps>
Specifies a React element that will be cloned and rendered inside the column menu of the Grid (see example).
<GridColumn columnMenu={CustomColumnMenu} />
columnType?
"data"
Sets the type of the column and renders a dedicated column for interaction.
<GridColumn columnType="checkbox" />
contextMenu?
boolean | GridContextMenuOptions | (options: GridCellBaseOptions) => boolean | GridContextMenuOptions
Specifies the context menu settings that will be applied to the column.
<GridColumn contextMenu={{ enabled: true }} />
editable?
boolean
Defines whether the column is editable (more information and examples).
<GridColumn editable={true} />
editor?
'text'
Defines the editor type. Used when the column enters the edit mode (more information and examples).
<GridColumn editor="date" />
field?
string
The field to which the column is bound.
filter?
'text'
Defines the filter type that will be rendered inside the filter row.
<GridColumn filter="numeric" />
filterable?
boolean
true
Defines if a filter UI will be rendered for this column.
<GridColumn filterable={false} />
filterTitle?
string
Defines the title which will be set to the input element in the filter cell.
<GridColumn filterTitle="Custom Filter Title" />
format?
string
The format that is applied to the value before it is displayed. Takes the {0:format}
form where format
is a standard number format, a custom number format, a standard date format, or a custom date format. For more information on the supported date and number formats, refer to the kendo-intl documentation.
boolean
true
Determines if the column can be dragged to the group panel.
<GridColumn groupable={false} />
headerClassName?
string
Sets the custom CSS classes to the column header cell.
headerSelectionValue?
boolean
Defines if the header selection checkbox is checked.
hidden?
boolean
false
Controls the visibility of the Grid's column.
<GridColumn hidden={true} />
id?
string
The column identifier used to distinguish columns for example in multi column header scenarios with resize and keyboard navigation. Also used for unique key for rendering the component cells. If not set, the component will generate unique id
automatically.
boolean
false
Defines if the column is locked (frozen or sticky). Locked columns are the columns that are visible at all times while the user scrolls the component horizontally.
<GridColumn locked={true} />
media?
string
Sets the screen size condition that needs to be satisfied for a column to remain visible. If you set the hidden property, the behavior of media is overridden.
<GridColumn media="(min-width: 600px)" />
menuIcon?
SVGIcon
Overrides the default (three vertical dots) column menu icon or the icon set through the (columnMenuIcon
) property.
<GridColumn menuIcon={CustomIcon} />
minResizableWidth?
number
The width of the column (in pixels) below which the user is not able to resize the column through the UI. Defaults to 10
.
number
Determinates the position of the column. Columns with smaller orderIndex
will appear before columns with bigger orderIndex
. Defaults to 0
.
boolean
Indicates whether the column is reorderable.
resizable?
boolean
Indicates whether the column is resizable.
rowSpannable?
boolean | GridRowSpannableSettings
Defines if the cells of the column should be spanned when their values are the same.
<GridColumn rowSpannable={true} />
sortable?
boolean | GridColumnSortSettings
true
Allows the column headers to be clicked and the sortChange
event emitted. You have to handle the sortChange
event yourself and sort the data.
<GridColumn sortable={true} />
title?
string
The title of the column.
validator?
FieldValidatorType | FieldValidatorType[]
The validation method for the edit field when editting is in mode dialog
.
The method arguments are:
Usable when validator depends on more than one field. Supports field paths.
name
prop.Usable when one validator is used across multiple fields.
Returns string
to signify error or undefined
to signify validation success.
string | number
The width of the column (in pixels).
RetroSearch is an open source project built by @garambo | Open a GitHub Issue
Search and Browse the WWW like it's 1997 | Search results from DuckDuckGo
HTML:
3.2
| Encoding:
UTF-8
| Version:
0.7.4