Grid Properties

Name	Type	Default	Description
Appearance	GridAppearance	N/A	An object that defines configurable options for customizing the visual appearance of the grid, including properties such as line color, spacing, background style, and border visibility.
Ai	GridAi	N/A	An object that defines configuration options for integrating AI capabilities within the grid component. This includes settings for enabling AI features, specifying AI service endpoints, setting authentication credentials, and customizing how the grid interacts with AI-powered functionalities.
Behavior	GridBehavior	N/A	An object that defines configuration options controlling the grid’s behavior, such as layout properties, sorting and filtering capabilities, selection modes, and responsiveness settings.
CurrentUser	object		Sets or retrieves the id of the currently active user. This value must match the id of one of the entries in the users property or array. The active user's privileges and access rights are determined based on their corresponding user object. If no current user is specified (i.e., the id is unset or invalid), the default privileges for the element will apply according to its properties, potentially restricting or allowing access based on default settings.
ColumnHeader	GridColumnHeader	N/A	Provides configuration options for customizing the appearance, labels, alignment, and behavior of column headers in a data table or grid.
Clipboard	GridClipboard	N/A	The clipboard property controls whether users can perform clipboard operations—such as copying (Ctrl+C), cutting (Ctrl+X), and pasting (Ctrl+V)—using keyboard shortcuts within the application. Setting this property to true enables these keyboard shortcuts for clipboard actions; setting it to false disables them, preventing users from using keyboard navigation for copying, cutting, or pasting content.
Columns	IEnumerable<IGridColumn>	[]	The columns property defines the collection of columns displayed within the Smart.Grid component. Each column configuration specifies how data is presented and interacted with. Through this property, you can control essential aspects such as column headers, data field bindings, sorting, filtering, formatting, alignment, visibility, and more. The columns property gives you full control over the structure, appearance, and behavior of the grid's columns, enabling advanced customization of both data presentation and user experience.
ContextMenu	GridContextMenu	N/A	The Context Menu is the drop-down menu that appears when a user right-clicks on a row within the Grid. This menu provides quick access to actions such as deleting a row or editing a cell or entire row, depending on the current editing mode configured for the Grid. You can customize the Context Menu by using the 'contextMenuItemCustom' option in the Grid's dataSource. This option lets you add your own custom menu items to enhance or extend the menu's functionality. Additionally, if you want to completely replace the default context menu with your own, you can use the 'selector' property. Set this property to the ID of a Smart.Menu component to display your custom menu when the user right-clicks on a row in the Grid.
ColumnMenu	GridColumnMenu	N/A	The Column Menu is a contextual drop-down menu that appears when you click the drop-down button in a column header, which becomes visible upon hovering over the header. This menu provides various options for customizing the behavior and appearance of the selected column. Common actions include sorting the grid by the column, applying filters to show or hide specific data, and grouping the grid rows based on the column’s values. The Column Menu offers an intuitive way for users to interact with and tailor the data grid to meet their specific needs.
ColumnGroups	IEnumerable<IGridColumnGroup>	N/A	Provides a detailed configuration of column group settings, including group names, ordering, visibility, and any hierarchical relationships between columns within the group.
DropDownMode	bool	false
ConditionalFormatting	IEnumerable<IGridConditionalFormatting>	N/A	Defines or retrieves the rules and settings for conditional formatting applied to the Grid's cells, allowing you to customize cell appearance (such as background color, font style, or icons) based on specific conditions or cell values.
Charting	GridCharting	N/A	Configures the data and display settings for the Grid Chart, enabling data visualization in a tabular grid format. This includes specifying the structure, appearance, and interactive features of the chart to present complex data clearly and intuitively.
CheckBoxes	GridCheckBoxes	N/A	Configures the checkbox options for the TreeGrid component, allowing you to enable or customize checkbox display, selection behavior, and interaction within the hierarchical grid structure.
DataExport	GridDataExport	N/A	Configures the export settings for grid data, including file format, selected columns, data range, export style, and additional export preferences.
DataSource	object	N/A	Specifies the source from which the grid retrieves its data. The dataSource property accepts either an instance of IEnumerable<object> for advanced data management and operations, or a standard Array containing the data records to be displayed in the grid. This flexibility allows developers to connect the grid to various data formats and structures, making data binding straightforward and versatile.
DataSourceSettings	GridDataSourceSettings	N/A	Configures the grid’s data source when the dataSource property is assigned either a JavaScript array (for local data) or a URL (for remote data). This setting determines how the grid retrieves and displays its data, supporting both direct array binding and remote data fetching via HTTP requests.
Editing	GridEditing	N/A	Provides comprehensive configuration options for controlling the grid's editing behavior, including enabling or disabling editing features, specifying editing modes (such as inline, popup, or batch), setting validation rules, and customizing editors for specific columns.
Filtering	GridFiltering	N/A	Provides detailed configuration options for the grid's filtering functionality, including filter types, default filter values, filter operators, and custom filter logic for columns. This determines how data within the grid can be searched, narrowed, or displayed based on user-defined criteria.
Footer	GridFooter	N/A	Provides configuration options for customizing the appearance and behavior of the grid's footer, including visibility, content, styling, and layout settings.
Formulas	bool	false	Enables or retrieves the ability to use Excel-style formulas as cell values within the table. Formulas must begin with an equal sign (=) and will be automatically recalculated whenever the referenced cell values are updated. This functionality relies on the third-party, free formula-parser plugin, so you must include the file 'formula-parser.min.js' in your project for this feature to work properly.
Grouping	GridGrouping	N/A	Provides detailed configuration options for the grid's data grouping functionality, specifying how rows are grouped, the grouping criteria, and related display settings within the grid.
GroupHeader	GridGroupHeader	N/A	Provides configuration options that define the appearance and behavior of the group header, including properties such as text, style, alignment, and visibility settings.
Header	GridHeader	N/A	Provides detailed configuration options for the grid's header, including display settings, styling, visibility, and customization of header rows and columns.
Layout	GridLayout	N/A	An object that defines configuration options for the layout of the grid, including properties such as the number of columns, row and column spacing, alignment, and overall grid arrangement. This object allows you to customize the appearance and structure of the grid according to your requirements.
UnlockKey	string	""	Sets or retrieves the unlockKey used to authorize and access the full functionality of the product. The unlockKey serves as a security credential to enable locked or premium features.
Locale	string	"en"	Specifies the language code to be used for displaying messages. When set, it determines which localized messages from the messages property are shown to the user. This property can be used to retrieve the current language or update it dynamically at runtime.
Keys	object	N/A	'Key Handling:' You can customize how key presses are handled by defining key mappings within the configuration. For each key (e.g., '"Enter"'), you can assign: - 'Another key as the value' (e.g., '"Enter": "Tab"'): When the specified key is pressed, it will be treated as if the mapped key was pressed instead. - 'A predefined action' (e.g., ''copy'', ''copyPrev'', ''copyNext'', ''delete''): When the key is pressed, the associated action will be executed. - 'A custom function': Assign a function as the value to execute custom logic whenever the key is pressed. This allows you to remap keys, trigger built-in actions, or define entirely custom behaviors based on key events in your application.
Messages	object	N/A	Assigns values to the messages property, which typically contains an array or object representing individual messages or notifications. This function or setting updates the content, ensuring that the correct message data is stored or displayed.
OnCellValue	Action<object>	N/A	Callback function invoked each time the Grid component requires a cell value for rendering. By implementing this function, you can customize or override the default logic used to retrieve and display cell values, enabling support for computed values, formatted data, or specialized rendering based on row or column context.
OnCellUpdate	Action<object>	N/A	Callback function that is triggered whenever a cell's value is about to be updated. You can use this function, for example, to perform an Ajax call to your server in order to validate or process the proposed cell changes before they are applied. If the server response indicates that the changes are valid, call the confirm function provided in the callback to finalize and apply the update. This allows for asynchronous validation and external control over cell modification in your data grid.
OnCellRender	Action<object>	N/A	A callback function that is invoked each time a cell is rendered in the grid. Use this function to modify or customize the properties of the GridCell before it is displayed to the user. This allows you to dynamically apply styles, set attributes, or inject content based on the cell's data or state.
OnCellBeginEdit	Action<object>	N/A	A callback function that is triggered when a cell enters edit mode. This function allows you to implement custom logic before editing begins. If the function returns false, the cell edit operation will be canceled and the cell will remain in its previous state. Use this to validate whether editing should be permitted based on your criteria.
OnCellEditRequest	Action<object>	N/A	A callback function that is triggered when a cell editing operation finishes in the Grid. This function is typically used together with the 'editing.readOnlyEdit' property set to true, which allows cells to appear read-only but still be editable through custom logic. The primary purpose of this callback is to handle post-editing actions, such as validating the input, processing changes, or updating the cell value in the Grid after the editing session ends. Use this function to programmatically update the data source or UI based on the user’s edits.
OnCellValueChanged	Action<object>	N/A	Invoked whenever a cell's value is updated, this callback function receives relevant information about the change—such as the new value, the previous value, and cell metadata—allowing you to handle updates, trigger side effects, or implement custom logic in response to user edits.
OnBeforeInit	Action<object>	N/A	Callback function that is executed before the grid initialization process begins. At this stage, the Grid's Virtual DOM has not yet been created, so any DOM manipulations or operations on grid elements should be avoided within this callback. Use this function to perform setup tasks or configure options that need to occur prior to the creation of the grid's internal structure.
OnInit	Action<object>	N/A	Callback function invoked during the grid initialization process, specifically after the Grid's Virtual DOM has been created. This allows you to perform custom actions or setup logic once the grid structure is ready in the DOM, but before it is rendered to the user.
OnAfterInit	Action<object>	N/A	Callback function that is executed after the grid has completed initialization and its Virtual DOM has been fully constructed. This allows you to perform any additional setup or actions that require the grid and its DOM elements to be ready.
OnChartInit	object	N/A	Callback function (chart: Smart.Chart) invoked after the chart has been fully initialized. Use this function to perform additional configuration or customization of the chart instance, such as modifying chart options, adding event listeners, or updating data before the chart is rendered to the user. This allows you to tailor the chart's appearance and behavior to meet specific application requirements.
OnRender	object	N/A	A callback function that is executed immediately after the grid has finished rendering, allowing you to perform additional actions or updates once the grid display is complete.
OnLoad	object	N/A	Callback function invoked after the grid has been rendered for the first time and all data bindings have been completed. At this point, the component is fully initialized and ready for interaction or further manipulation.
OnKey	Action<object>	N/A	Callback function (event: KeyboardEvent) that is invoked whenever the grid component has focus and the user presses any keyboard key. This function allows you to handle and respond to keyboard interactions within the grid, accessing the pressed key and related event properties via the KeyboardEvent object.
OnRowInit	Action<object>	N/A	Callback function invoked during the initialization of a row. Use this function to customize row properties, apply conditional logic, or modify row data before it is rendered. The function receives the row's data and context as parameters, allowing for dynamic adjustments based on specific requirements.
OnRowDetailInit	Action<object>	N/A	Callback function invoked during the initialization of a row’s detail section. This function is triggered before the row detail is rendered, allowing you to customize or modify the detail content. Row details can be displayed either directly beneath the associated row in the main data table, or within a separate dialog window, depending on the configuration.
OnRowDetailUpdated	Action<object>	N/A	Callback function that is invoked when the details of a table row are being updated. This function allows you to implement custom logic or handle events during the row detail update process.
OnRowHistory	Action<object>	N/A	A callback function that is triggered whenever a row’s edit history is updated. This function is invoked only if the 'storeHistory' property is enabled, ensuring that all changes made to a row are recorded. Use this callback to handle actions such as syncing changes, auditing edits, or updating related UI components whenever a row’s edit history changes.
OnRowStyle	Action<object>	N/A	Callback function triggered when the style of a row is updated. This event occurs whenever a row's styling changes, either through the row dialog interface or programmatically via the setRowStyle method. The callback receives relevant information about the updated row and its new style, enabling custom handling or additional processing in response to the style change.
OnRowInserted	Action<object>	N/A	Callback function that is executed immediately after a new row has been successfully inserted. It receives relevant information about the newly inserted row as arguments, allowing you to perform custom actions or post-processing in response to the insertion event.
OnRowRemoved	Action<object>	N/A	A callback function that is executed immediately after a row has been successfully removed from the data set or table. This function receives relevant information about the removed row, allowing you to perform custom actions such as updating the UI, triggering notifications, or handling related cleanup tasks.
OnRowUpdate	Action<object>	N/A	Callback function triggered when a row's cell values are updated. Use this function to perform custom actions—such as making an AJAX request to the server to validate the edited data. After receiving validation results, if the changes are approved, call the confirm function to finalize the update.
OnRowUpdated	Action<object>	N/A	Callback function that is invoked immediately after a row has been updated. Receives the updated row data and additional context as parameters, enabling custom logic or side effects in response to row changes.
OnRowClass	Action<object>	N/A	This callback function is invoked by the Grid component, if provided, for each row. It is used to determine and return the CSS class name(s) that should be applied to the specific row, allowing for dynamic or conditional styling based on the row data or index.
OnCellClass	Action<object>	N/A	"This callback function, when provided to the Grid, is invoked for each cell to determine the CSS class(es) that should be applied. Use this function to dynamically assign one or more CSS classes to individual cells based on their data, state, or other custom logic."
OnColumnInit	Action<object>	N/A	Callback function that is invoked after a column has been initialized. This function receives the column instance as a parameter and can be used to modify column properties, apply custom settings, or perform additional setup specific to that column. Use this callback to tailor column behavior or appearance during the initialization process.
OnColumnInserted	Action<object>	N/A	Callback function that is invoked whenever a new column is successfully inserted into the structure or component. This function receives relevant information about the inserted column, allowing you to perform custom logic or updates in response to the insertion event.
OnColumnRemoved	Action<object>	N/A	Callback function that is triggered after a column has been successfully removed. This function receives relevant information about the removed column as its arguments, allowing you to perform additional actions or updates in response to the removal event.
OnColumnUpdated	Action<object>	N/A	Callback function that is invoked whenever the data in a column is updated. Receives relevant information about the updated column, such as the column identifier and the new value, allowing you to implement custom behavior in response to column changes.
OnColumnClone	Action<object>	N/A	Callback function that is invoked immediately after a column has been successfully cloned. This function receives relevant context or event data as its arguments, allowing you to perform custom logic or side effects in response to the cloning action.
OnCommand	Action<object>	N/A	Callback function that is triggered when a command is executed. - The name parameter specifies the name of the command. - The command parameter refers to the function that implements the command’s logic. - The details parameter contains the arguments for the command, as provided by the Grid. - The handled parameter is a flag you can set to true within the callback to prevent the Grid from executing the command’s default behavior, allowing you to fully override or customize the command’s handling.
Paging	GridPaging	N/A	Provides detailed configuration options for managing pagination, including parameters such as the number of items per page, current page index, and total number of pages. This section ensures efficient data retrieval and navigation across multiple pages of results.
Pager	GridPager	N/A	Provides detailed configuration options for pager controls, including settings for page size, navigation buttons, and display style. These options determine how pagination is displayed and how users interact with paged content in the interface.
RowDetail	GridRowDetail	N/A	Configures or updates the detailed information or content associated with a specific row, often used to display additional data or expanded views for that row.
RowCSSRules	object	N/A	Sets or gets the CSS class rules for table rows. This property allows you to conditionally apply different CSS class names to rows based on custom logic. You provide an object where the keys are CSS class names and the values are functions that determine whether the class should be applied to a particular row. Each function receives a settings object with the following properties: - 'index': The numerical index of the current row. - 'data': The data object for the current row. - 'row': The raw row element or reference (depending on the implementation). - 'api': A reference to the table's API for advanced operations. 'Example usage:' '''js rowCSSRules: { 'cell-class-1': settings => settings.data.quantity === 5, 'cell-class-2': settings => settings.data.quantity < 5, 'cell-class-3': settings => settings.data.quantity > 5 } ''' In this example, based on the 'quantity' property of the row's data, a different CSS class will be applied to that row. Multiple rules can be defined, and each will be evaluated for every row. If the function returns 'true', the corresponding class will be added to the row.
RightToLeft	bool	false	Gets or sets a value that determines whether the element's alignment is configured for right-to-left (RTL) languages, ensuring proper layout and text direction for locales such as Arabic or Hebrew.
Rows	object	N/A	The rows property contains an array of objects, with each object representing a single row in the grid. This property defines all the data entries that are rendered and displayed as rows within the grid component. Each element in the rows array should align with the column definitions, ensuring that the grid displays structured and consistent data across all rows.
Scrolling	Scrolling	Scrolling.Physical	Configures the scroll mode behavior, allowing you to define how scrolling is handled within the component or page. This setting determines options such as smooth or instant scrolling, vertical or horizontal direction, and any custom scroll-related parameters.
SummaryRow	GridSummaryRow	N/A	Provides detailed configuration options for displaying and customizing the summary row, including its appearance, position, aggregation methods, and which columns are summarized.
StateSettings	GridStateSettings	N/A	Configures the grid's state-related settings, including properties such as selection, sorting, filtering, pagination, and layout. This determines how the grid maintains and restores its current state during user interactions or when the page is reloaded.
Selection	GridSelection	N/A	Provides detailed configuration options for user selection behavior, including parameters such as selection mode (single or multiple), default selections, selection limits, and customizable callbacks for selection events.
Sorting	GridSorting	N/A	Provides detailed configuration options for controlling how data is sorted, including criteria such as sorting field, order (ascending or descending), and support for multiple sort keys.
Users	IEnumerable<object>	[]	Defines the users displayed on the grid. Expects an array of user objects, where each object must include an 'id' (unique identifier) and a 'name' (display name). Optionally, each user object can also include a 'color' (for customizing the user's appearance) and an 'image' (URL or path to the user's avatar image).
UploadSettings	GridUploadSettings	N/A	Configures the upload settings for images and attachments in the grid's image and attachment columns, including options for file type restrictions, size limits, and image filters to be applied during the upload process.
View	string	"grid"	Specifies the layout mode for displaying data within the interface. Acceptable values are: - ''grid'': Presents items in a tabular, spreadsheet-like format with rows and columns. - ''kanban'': Arranges items into columns representing workflow stages, similar to task boards. - ''card'': Displays each item as an individual card, typically used for concise summaries or visual grouping. Choose one of these values to determine how data is visually organized and presented to the user.

Grid Methods

Name	Type	Arguments	Description
AddFilter	void	string dataField, string filter, bool refreshFilters	Enhances and applies custom filter criteria to a specific column within the data grid. Accepts both single and multiple filter expressions, allowing for complex filtering logic using logical operators such as "and" and "or". For example, to filter the "lastName" column for values that contain either "burke" or "peterson", use: `grid.addFilter('lastName', ['CONTAINS "burke"', 'or', 'CONTAINS "peterson"'])`. The method also supports numeric filters (e.g., `GREATER_THAN 100`), a variety of comparison operators (such as `EQUALS`, `LESS_THAN`, `STARTS_WITH`, etc.), and can be used to combine different conditions for precise data selection.Args: string dataField - The data field name of the column to filter, e.g., 'firstName'.,string filter - The filter expression(s) to apply. Examples include 'startsWith B', ['contains Andrew or contains Nancy'], or ['quantity', '<= 3 and >= 8']. Supported operators: '=', 'EQUAL', '<>', 'NOT_EQUAL', '!=', '<', 'LESS_THAN', '>', 'GREATER_THAN', '<=', 'LESS_THAN_OR_EQUAL', '>=', 'GREATER_THAN_OR_EQUAL', 'starts with', 'STARTS_WITH', 'ends with', 'ENDS_WITH', '', 'EMPTY', 'CONTAINS', 'DOES_NOT_CONTAIN', 'NULL', 'NOT_NULL'.,bool refreshFilters - If set to false, allows multiple filters to be added without triggering unnecessary renders. Useful when applying multiple filters sequentially.
AddFilter	void	string dataField, string filter	Enhances and applies custom filter criteria to a specific column within the data grid. Accepts both single and multiple filter expressions, allowing for complex filtering logic using logical operators such as "and" and "or". For example, to filter the "lastName" column for values that contain either "burke" or "peterson", use: `grid.addFilter('lastName', ['CONTAINS "burke"', 'or', 'CONTAINS "peterson"'])`. The method also supports numeric filters (e.g., `GREATER_THAN 100`), a variety of comparison operators (such as `EQUALS`, `LESS_THAN`, `STARTS_WITH`, etc.), and can be used to combine different conditions for precise data selection.
AddGroup	void	string dataField	Organizes the grid rows into groups based on the values in the specified column's data field. This functionality requires that grouping is enabled on the grid component. When activated, rows sharing the same value in the chosen column will be visually grouped together, allowing for easier data analysis and navigation.Args: string dataField - The data field of the column to group by, e.g., 'firstName'.
AddNewColumn	bool	IEnumerable<object> column	Dynamically adds a new column to the grid at runtime, allowing users to modify the grid’s structure without requiring a page reload. This enables real-time updates to the grid layout based on user actions or application logic.Args: dynamic column - A column definition or array of columns to add. Refer to the grid's 'columns' property for the expected structure.
AddNewRow	bool	string position	Inserts a new row into the grid and automatically activates edit mode for that row, allowing users to begin entering data right away. If batch editing is enabled, any changes made will be temporarily stored and will not be saved to the data source until the batch edit session is explicitly committed. This helps prevent partial or unsaved changes from being applied before the user finalizes all edits in the session.Args: string position - Specifies the position where the new row will be added. Acceptable values are 'near' (top) or 'far' (bottom).
AddNewRow	bool	N/A	Inserts a new row into the grid and automatically activates edit mode for that row, allowing users to begin entering data right away. If batch editing is enabled, any changes made will be temporarily stored and will not be saved to the data source until the batch edit session is explicitly committed. This helps prevent partial or unsaved changes from being applied before the user finalizes all edits in the session.
AddRow	void	object data, bool insertAtBottom, object callback	Inserts a new row into the grid interface. When batch editing mode is enabled, the new row exists only temporarily within the current batch session and will not be permanently stored until the user explicitly saves all changes made during the session. If the batch edit session is discarded, the newly added row will not be saved.Args: object data - An object representing the row data, matching the structure of the grid's data source.,bool insertAtBottom - Determines whether the new row is added at the bottom (true) or top (false) of the grid. Defaults to true.,object callback - A callback function invoked after the row is successfully added. Receives the newly added row as an argument.
AddRow	void	object data	Inserts a new row into the grid interface. When batch editing mode is enabled, the new row exists only temporarily within the current batch session and will not be permanently stored until the user explicitly saves all changes made during the session. If the batch edit session is discarded, the newly added row will not be saved.
AddSort	void	string dataField, string sortOrder	Enhances the grid's data display by applying a sorting order based on the specified column's data field. This function requires sorting to be enabled on the grid and sorts the rows according to the selected column's values, either in ascending or descending order as specified. If sorting is not enabled, this operation will have no effect.Args: string dataField - The data field of the column to sort, e.g., 'firstName'.,string sortOrder - The sort direction to apply. Use 'asc' for ascending or 'desc' for descending.
AddUnboundRow	bool	int count, string position	Adds one or more unbound rows to the grid, positioned at either the top or the bottom, as specified. Unbound rows are not initially included in the grid’s data source; instead, they serve as editable placeholders. Once a user enters or modifies data in these rows, the new values are incorporated into the grid’s data source, making the unbound rows part of the main dataset. This feature is useful for allowing users to quickly add new entries or perform custom calculations directly within the grid interface.Args: int count - The number of unbound rows to add.,string position - The position to insert the unbound rows. Accepts 'near' for top or 'far' for bottom.
AddUnboundRow	bool	int count	Adds one or more unbound rows to the grid, positioned at either the top or the bottom, as specified. Unbound rows are not initially included in the grid’s data source; instead, they serve as editable placeholders. Once a user enters or modifies data in these rows, the new values are incorporated into the grid’s data source, making the unbound rows part of the main dataset. This feature is useful for allowing users to quickly add new entries or perform custom calculations directly within the grid interface.
AreAllRowsSelected	bool	N/A	Returns a boolean value that indicates whether every row in the grid is currently selected. This means the method will return true only if all rows within the grid have been selected; otherwise, it returns false.
AutoSizeColumn	void	string dataField	Automatically resizes an individual grid column to precisely fit its content by dynamically measuring the widest content among its cells and header label, and adjusting the column width accordingly for optimal display without unnecessary extra space or truncation.Args: string dataField - The data field name of the column to auto-size, e.g., 'firstName'. Optional; if omitted, no action is taken.
AutoSizeColumn	void	N/A	Automatically resizes an individual grid column to precisely fit its content by dynamically measuring the widest content among its cells and header label, and adjusting the column width accordingly for optimal display without unnecessary extra space or truncation.
AutoSizeColumns	void	N/A	Dynamically resizes the width of each grid column based on its content and header label, so that all cell values and headers are fully visible without clipping or excessive whitespace. This ensures an optimal and polished display by automatically fitting columns to their widest required size.
AutoSizeRows	void	N/A	Dynamically resizes each grid row to fit its content, ensuring that text and elements are fully visible without being cut off or overlapping. This enhances readability and provides a more user-friendly and visually consistent grid layout.
BeginEdit	void	object rowId, string dataField	Initiates edit mode on a specified row, cell, or column within the grid programmatically. Triggers the appropriate editor component to appear in the Grid UI, allowing users to modify the data directly within the selected grid area.Args: string rowId - The unique identifier of the row to edit.,string dataField - The column's data field to edit. Optional for full row editing.
BeginEdit	void	object rowId	Initiates edit mode on a specified row, cell, or column within the grid programmatically. Triggers the appropriate editor component to appear in the Grid UI, allowing users to modify the data directly within the selected grid area.
BeginEdit	void	string rowId, string dataField	Initiates edit mode on a specified row, cell, or column within the grid programmatically. Triggers the appropriate editor component to appear in the Grid UI, allowing users to modify the data directly within the selected grid area.Args: string rowId - The unique identifier of the row to edit.,string dataField - The column's data field to edit. Optional for full row editing.
BeginEdit	void	string rowId	Initiates edit mode on a specified row, cell, or column within the grid programmatically. Triggers the appropriate editor component to appear in the Grid UI, allowing users to modify the data directly within the selected grid area.
BeginEdit	void	int rowId, string dataField	Initiates edit mode on a specified row, cell, or column within the grid programmatically. Triggers the appropriate editor component to appear in the Grid UI, allowing users to modify the data directly within the selected grid area.Args: int rowId - The unique identifier of the row to edit.,string dataField - The column's data field to edit. Optional for full row editing.
BeginEdit	void	int rowId	Initiates edit mode on a specified row, cell, or column within the grid programmatically. Triggers the appropriate editor component to appear in the Grid UI, allowing users to modify the data directly within the selected grid area.
BeginUpdate	void	N/A	Pauses Grid rendering and UI refresh operations, allowing you to make multiple property changes or method calls without triggering repeated re-renders. This is particularly useful for optimizing performance during batch updates. After you finish making all necessary changes, call 'endUpdate()' to resume rendering and apply all updates to the UI.
CancelEdit	void	N/A	Cancels the ongoing edit operation by closing any active editor interface and reverting all unsaved changes made during the current session. This action ensures that no modifications are saved and the data returns to its original state prior to editing.
CheckAllRows	void	N/A	Selects and checks all checkboxes associated with rows in a TreeGrid or grouped data structure, ensuring that every row, including nested and grouped items, is marked as selected. This process guarantees comprehensive selection across all hierarchical levels and groupings within the dataset.
CheckRow	void	object rowId	Selects and checks the checkbox for a specified TreeGrid row, visually indicating that the row is active or selected. This action updates the row's state to reflect user selection and may trigger related event handlers or selection-dependent functionality within the TreeGrid.Args: string rowId - The unique identifier of the row to check.
CheckRow	void	string rowId	Selects and checks the checkbox for a specified TreeGrid row, visually indicating that the row is active or selected. This action updates the row's state to reflect user selection and may trigger related event handlers or selection-dependent functionality within the TreeGrid.Args: string rowId - The unique identifier of the row to check.
CheckRow	void	int rowId	Selects and checks the checkbox for a specified TreeGrid row, visually indicating that the row is active or selected. This action updates the row's state to reflect user selection and may trigger related event handlers or selection-dependent functionality within the TreeGrid.Args: int rowId - The unique identifier of the row to check.
ClearFilter	void	N/A	Removes all active filters from the Grid, restoring the original unfiltered data view. After clearing the filters, the Grid data is automatically refreshed to display all records, and any filter input fields are reset to their default, empty state.
ClearGroups	void	N/A	Restores the grid to its original, ungrouped state by removing all active row groupings. All grouped rows are expanded and displayed as individual rows, and the Grid view automatically refreshes to reflect these changes.
ClearRows	void	N/A	Removes all rows and associated data from the Grid, and clears any current user selections. After performing this action, the Grid will display a 'No Rows' message to indicate that it is empty.
ClearSelection	void	N/A	Clears all current selections within the grid, including rows, cells, and columns. This action removes any visual highlights or selection indicators, ensuring that no items remain selected in the interface.
ClearSort	void	N/A	Removes all active sorting from the Grid columns, resetting them to their unsorted state and restoring the data to its original order as initially loaded or received.
CloseDropDown	void	N/A	Closes the grid's drop-down user interface when the 'dropDownMode' property is set to true, ensuring that any open drop-down menus within the grid are dismissed automatically. This helps maintain a streamlined user experience by hiding drop-down elements when they are no longer needed or when specific actions are triggered.
CloseMenu	void	N/A	Closes the currently open column menu in a data grid or table interface. This action is typically triggered by user interactions such as right-clicking on a column header or clicking a column menu button, allowing users to dismiss the column-specific options or actions menu.
CloseSidePanel	void	N/A	Closes the side panel component of the Grid interface, hiding any currently displayed content or options and returning the Grid to its default view.
CollapseAllRows	void	N/A	Collapses all currently expanded rows within the TreeGrid or Grouping components, reducing the dataset display to only show parent rows or top-level groups. This action hides all child rows and nested data, providing a simplified, minimized overview of the dataset structure.
CollapseRow	void	object rowId	Collapses a designated TreeGrid or grouping row, effectively hiding all of its nested child rows from view. This action allows users to condense hierarchical data structures, making it easier to navigate and focus on higher-level information within the grid.Args: string rowId - The unique identifier of the row to collapse.
CollapseRow	void	string rowId	Collapses a designated TreeGrid or grouping row, effectively hiding all of its nested child rows from view. This action allows users to condense hierarchical data structures, making it easier to navigate and focus on higher-level information within the grid.Args: string rowId - The unique identifier of the row to collapse.
CollapseRow	void	int rowId	Collapses a designated TreeGrid or grouping row, effectively hiding all of its nested child rows from view. This action allows users to condense hierarchical data structures, making it easier to navigate and focus on higher-level information within the grid.Args: int rowId - The unique identifier of the row to collapse.
CreateChart	void	string type, object dataSource	Generates a visual chart representation based on the current data within the Grid. Chart generation requires that the charting feature is enabled in the system configuration. This function allows users to visualize the Grid's dataset in supported chart formats.Args: string type - Type of chart to create (e.g., 'pie', 'bar', 'line').,object dataSource - The data source for the chart. If omitted, the Grid's current dataset is used.
CreateChart	void	string type	Generates a visual chart representation based on the current data within the Grid. Chart generation requires that the charting feature is enabled in the system configuration. This function allows users to visualize the Grid's dataset in supported chart formats.
DeleteRow	void	object rowId, object callback	Removes a specific row from the Grid component. If batch editing is enabled, the row will be marked for deletion but the change will not be permanently applied until the batch is saved. This means the deletion is pending and can be reverted before saving.Args: string rowId - The unique identifier of the row to delete.,object callback - Function executed after row deletion. Receives the deleted row as a parameter.
DeleteRow	void	object rowId	Removes a specific row from the Grid component. If batch editing is enabled, the row will be marked for deletion but the change will not be permanently applied until the batch is saved. This means the deletion is pending and can be reverted before saving.
EndEdit	void	N/A	Completes the editing process by applying all pending changes, saving the updated content, and closing any open editor instances. This action ensures that all modifications are confirmed and no unsaved edits remain.
EndUpdate	void	bool refresh	Restores the Grid's normal rendering process and updates the user interface following a call to beginUpdate(). Use endUpdate() to apply any changes made during the update suspension and ensure the Grid displays the latest data and layout.Args: bool refresh - If true, forces a full Grid refresh after updates.
EndUpdate	void	N/A	Restores the Grid's normal rendering process and updates the user interface following a call to beginUpdate(). Use endUpdate() to apply any changes made during the update suspension and ensure the Grid displays the latest data and layout.
EnsureVisible	bool	object rowId, string dataField	Scrolls the Grid to ensure that a specific row or cell is visible to the user. If the target row or cell is located on a different page, the Grid will automatically navigate to the appropriate page and then scroll to the desired position. This ensures that the requested row or cell is brought into view, regardless of its current visibility or page location.Args: string rowId - The unique identifier of the row.,string dataField - The column's data field to focus on. If omitted, scrolls to the row only.
EnsureVisible	bool	object rowId	Scrolls the Grid to ensure that a specific row or cell is visible to the user. If the target row or cell is located on a different page, the Grid will automatically navigate to the appropriate page and then scroll to the desired position. This ensures that the requested row or cell is brought into view, regardless of its current visibility or page location.
EnsureVisible	bool	string rowId, string dataField	Scrolls the Grid to ensure that a specific row or cell is visible to the user. If the target row or cell is located on a different page, the Grid will automatically navigate to the appropriate page and then scroll to the desired position. This ensures that the requested row or cell is brought into view, regardless of its current visibility or page location.Args: string rowId - The unique identifier of the row.,string dataField - The column's data field to focus on. If omitted, scrolls to the row only.
EnsureVisible	bool	string rowId	Scrolls the Grid to ensure that a specific row or cell is visible to the user. If the target row or cell is located on a different page, the Grid will automatically navigate to the appropriate page and then scroll to the desired position. This ensures that the requested row or cell is brought into view, regardless of its current visibility or page location.
EnsureVisible	bool	int rowId, string dataField	Scrolls the Grid to ensure that a specific row or cell is visible to the user. If the target row or cell is located on a different page, the Grid will automatically navigate to the appropriate page and then scroll to the desired position. This ensures that the requested row or cell is brought into view, regardless of its current visibility or page location.Args: int rowId - The unique identifier of the row.,string dataField - The column's data field to focus on. If omitted, scrolls to the row only.
EnsureVisible	bool	int rowId	Scrolls the Grid to ensure that a specific row or cell is visible to the user. If the target row or cell is located on a different page, the Grid will automatically navigate to the appropriate page and then scroll to the desired position. This ensures that the requested row or cell is brought into view, regardless of its current visibility or page location.
ExpandAllRows	void	N/A	Expands all rows within the grid that utilize TreeGrid or grouping functionality, automatically revealing every nested child row at all levels of hierarchy and making the complete data structure fully visible. This ensures that all parent and descendant rows are displayed, allowing users to view the entire nested dataset without manual expansion.
ExpandRow	void	object rowId	Expands a specific row in a TreeGrid or grouped table to reveal its associated child rows. You can expand nested groups or hierarchical levels by specifying the row key using dot notation (e.g., "0.2.1" for the child of a nested group). This allows for precise targeting and interactive exploration of hierarchical data structures within the grid.Args: string rowId - The unique identifier of the row to expand.
ExpandRow	void	string rowId	Expands a specific row in a TreeGrid or grouped table to reveal its associated child rows. You can expand nested groups or hierarchical levels by specifying the row key using dot notation (e.g., "0.2.1" for the child of a nested group). This allows for precise targeting and interactive exploration of hierarchical data structures within the grid.Args: string rowId - The unique identifier of the row to expand.
ExpandRow	void	int rowId	Expands a specific row in a TreeGrid or grouped table to reveal its associated child rows. You can expand nested groups or hierarchical levels by specifying the row key using dot notation (e.g., "0.2.1" for the child of a nested group). This allows for precise targeting and interactive exploration of hierarchical data structures within the grid.Args: int rowId - The unique identifier of the row to expand.
ExpandRowsToGroupLevel	void	int level	Expands all grouped rows in the grid up to the specified group level. For instance, executing `grid.expandRowsToGroupLevel(1);` will expand all groups at the root (level 1), making their immediate child rows visible. Groups nested within these child rows remain collapsed unless the group level parameter is increased. This function is useful for programmatically controlling the grid's row expansion state based on grouping hierarchy.Args: int level - The group level up to which the rows should be expanded. Level 0 is the root, level 1 is the first nested group, and so forth.
ExportData	void	string Dataformat, object callback, object dataCallback	This function allows you to export the grid's data into various supported file formats, including .XLSX, .PDF, .JSON, .XML, .CSV, .TSV, .HTML, .JPEG, and .PNG. The way the data is exported—such as file formatting, included columns or rows, applied filters, and export settings—is determined by the options set in the grid’s dataExport property. This ensures that the exported file matches your specified requirements and preferences.Args: string Data format - Specifies the export format. Supported formats: 'xlsx', 'pdf', 'json', 'xml', 'csv', 'tsv', 'html', 'png', 'jpeg'.,object callback - Optional. A function that formats the exported values conditionally. See Smart Export Documentation for details.,object dataCallback - Optional. A function to modify the entire exported data object prior to export.
ExportData	void	string Dataformat	This function allows you to export the grid's data into various supported file formats, including .XLSX, .PDF, .JSON, .XML, .CSV, .TSV, .HTML, .JPEG, and .PNG. The way the data is exported—such as file formatting, included columns or rows, applied filters, and export settings—is determined by the options set in the grid’s dataExport property. This ensures that the exported file matches your specified requirements and preferences.
FilterBy	void	string query, string dataType	Applies a global filter that searches for the provided query across all columns in the grid, returning rows that contain a match in any column. Optionally, you can limit the filtering to specific data types—such as 'string', 'boolean', 'date', or 'number'—so that only columns of the selected type(s) are considered when matching the query. This allows for more precise and targeted filtering behavior.Args: string query - The filter expression to apply to all columns.,string dataType - Optional. Filter rows only by columns matching this data type: 'string', 'boolean', 'date', 'number'.
FilterBy	void	string query	Applies a global filter that searches for the provided query across all columns in the grid, returning rows that contain a match in any column. Optionally, you can limit the filtering to specific data types—such as 'string', 'boolean', 'date', or 'number'—so that only columns of the selected type(s) are considered when matching the query. This allows for more precise and targeted filtering behavior.
Find	IEnumerable<object>	string query, string dataField, string condition	Searches the grid for rows that match the specified query criteria and returns an array containing the IDs of all matching rows. Supports multiple search modes, including:<br/><br/>- Searching for values in any column (global search)<br/>- Searching specific columns by name<br/>- Applying comparison operators (e.g., equals, contains, less than, greater than) for advanced filtering<br/><br/>This functionality allows for flexible and precise row selection based on user-defined search parameters.Args: string query - The search string or value to find within the grid rows.,string dataField - Optional. Specifies the column data field to restrict the search to.,string condition - Optional. Condition to apply for the search. Supported conditions: '=', 'EQUAL', '<>', 'NOT_EQUAL', '!=', '<', 'LESS_THAN', '>', 'GREATER_THAN', '<=', 'LESS_THAN_OR_EQUAL', '>=', 'GREATER_THAN_OR_EQUAL', 'starts with', 'STARTS_WITH', 'ends with', 'ENDS_WITH', '', 'EMPTY', 'CONTAINS', 'DOES_NOT_CONTAIN', 'NULL', 'NOT_NULL'.
Find	IEnumerable<object>	string query	Searches the grid for rows that match the specified query criteria and returns an array containing the IDs of all matching rows. Supports multiple search modes, including: - Searching for values in any column (global search) - Searching specific columns by name - Applying comparison operators (e.g., equals, contains, less than, greater than) for advanced filtering This functionality allows for flexible and precise row selection based on user-defined search parameters.
FindCells	IEnumerable<object>	string query	Scans the grid to identify all cells that match the specified query. Returns an array of arrays, where each inner array represents a matching cell and contains the following information: the row ID, the data field (column name), and the cell's value. The query supports searching for multiple values by separating them with commas; each value will be matched independently against the cells.Args: string query - The search string or multiple comma-separated strings to find in grid cells.
FirstPage	void	N/A	Navigates to the first page of the data grid when paging functionality is enabled. This action resets the current page index to the first page, displaying the initial set of records in the grid.
FocusAndSelect	void	object rowId, string dataField	Sets focus on and selects a specified cell or an entire row within the grid, clearing any previous selections. This action also updates the keyboard navigation's starting point to the newly focused cell or row, ensuring that subsequent navigation actions will originate from this location.Args: string rowId - The unique identifier of the row to focus and select.,string dataField - Optional. The data field (column key) of the cell to focus within the specified row. If omitted, the entire row is selected.
FocusAndSelect	void	object rowId	Sets focus on and selects a specified cell or an entire row within the grid, clearing any previous selections. This action also updates the keyboard navigation's starting point to the newly focused cell or row, ensuring that subsequent navigation actions will originate from this location.
FocusAndSelect	void	string rowId, string dataField	Sets focus on and selects a specified cell or an entire row within the grid, clearing any previous selections. This action also updates the keyboard navigation's starting point to the newly focused cell or row, ensuring that subsequent navigation actions will originate from this location.Args: string rowId - The unique identifier of the row to focus and select.,string dataField - Optional. The data field (column key) of the cell to focus within the specified row. If omitted, the entire row is selected.
FocusAndSelect	void	string rowId	Sets focus on and selects a specified cell or an entire row within the grid, clearing any previous selections. This action also updates the keyboard navigation's starting point to the newly focused cell or row, ensuring that subsequent navigation actions will originate from this location.
FocusAndSelect	void	int rowId, string dataField	Sets focus on and selects a specified cell or an entire row within the grid, clearing any previous selections. This action also updates the keyboard navigation's starting point to the newly focused cell or row, ensuring that subsequent navigation actions will originate from this location.Args: int rowId - The unique identifier of the row to focus and select.,string dataField - Optional. The data field (column key) of the cell to focus within the specified row. If omitted, the entire row is selected.
FocusAndSelect	void	int rowId	Sets focus on and selects a specified cell or an entire row within the grid, clearing any previous selections. This action also updates the keyboard navigation's starting point to the newly focused cell or row, ensuring that subsequent navigation actions will originate from this location.
ForEachRow	void	object rowCallback	Executes a callback function for each individual row in the grid's underlying dataset, regardless of any grouping, filtering, or sorting currently applied to the grid view. This method iterates over all raw data rows, ensuring that the callback is called on every entry as it exists in the original data source, not just the rows that are visible or active in the grid's current state.Args: object rowCallback - A callback function that receives a row object as its parameter. Example: grid.forEachRow(row => console.log(row.id));
ForEachRowAfterFilterAndSort	void	object rowCallback	Executes a callback function for each row that is currently visible in the grid after all active filters and sorting have been applied. This method operates strictly on the rows as they appear in the current grid view, ensuring that hidden, filtered out, or unsorted rows are excluded. The iteration respects the latest grid state, guaranteeing that only rows displayed to the user are processed by the callback function.Args: object rowCallback - A callback function that receives a row object as its parameter. Example: grid.forEachRowAfterFilterAndSort(row => console.log(row.id));
GetBatchEditChanges	object	N/A	Retrieves a comprehensive summary of all changes performed during a batch edit operation. Returns an object with separate arrays for added, updated, and deleted rows. Each array contains detailed objects that include the row ID and pertinent data fields, such as the previous and new values for updates, full data for additions, and identifying information for deletions. This structure allows you to easily track and process all modifications made in the batch.
GetCellValue	object	object rowId, string dataField	Retrieves the value stored in a specific cell of a data grid or table by specifying the unique row ID and the corresponding column data field. This function allows precise access to individual cell data, enabling targeted data retrieval based on both row and column identifiers.Args: string rowId - The unique identifier of the row containing the cell.,string dataField - The data field name of the column (e.g., 'firstName').
GetCellValue	object	string rowId, string dataField	Retrieves the value stored in a specific cell of a data grid or table by specifying the unique row ID and the corresponding column data field. This function allows precise access to individual cell data, enabling targeted data retrieval based on both row and column identifiers.Args: string rowId - The unique identifier of the row containing the cell.,string dataField - The data field name of the column (e.g., 'firstName').
GetCellValue	object	int rowId, string dataField	Retrieves the value stored in a specific cell of a data grid or table by specifying the unique row ID and the corresponding column data field. This function allows precise access to individual cell data, enabling targeted data retrieval based on both row and column identifiers.Args: int rowId - The unique identifier of the row containing the cell.,string dataField - The data field name of the column (e.g., 'firstName').
GetCheckedAsync()	Task<bool>	'N/A'	Gets the &quot;Checked&quot; property as Task&lt;bool&gt;.
GetColumn	GridColumn	string dataField	Retrieves the column object corresponding to the specified data field. This returned object includes all relevant properties and configuration settings for that column, such as its header label, data type, formatting options, sorting behavior, visibility, and any custom properties defined in the column schema.Args: string dataField - The data field name of the column to retrieve.
GetColumnProperty	object	string dataField, string propertyName	Fetches the value of a specified property from a particular column, where the column is identified by its data field name. This function allows you to access detailed configuration or metadata associated with a column in a data structure, such as a table or grid, by referencing the column’s data field.Args: string dataField - The data field name of the column.,string propertyName - The name of the column property to retrieve (e.g., 'freeze', 'visible', 'width').
GetColumns	IEnumerable<object>	N/A	Retrieves an array of column objects representing every column currently configured in the grid. Each column object contains key properties, including:<br/><br/>- `label`: The display name of the column as shown in the grid header.<br/>- `dataField`: The underlying data field or key this column is bound to in the dataset.<br/>- `dataType`: The type of data displayed in the column (e.g., string, number, date).<br/>- `visible`: A boolean indicating whether the column is currently visible in the grid.<br/>- Additional dynamic state properties, such as the current sort order, filter status, or column width, reflecting any user customizations or interactions.<br/><br/>This comprehensive array allows developers to access both the static configuration and real-time state of each column in the grid.
GetDataSourceAsync()	Task<IEnumerable<object>>	'N/A'	Gets the &quot;DataSource&quot; property as Task&lt;IEnumerable&lt;object&gt;&gt;.
GetEditCells	IEnumerable<object>	N/A	Returns an array containing information about all cells that are currently in edit mode within the grid. Each entry in the array typically includes details such as the row and column identifiers for each editable cell, allowing developers to precisely identify and interact with cells that are being edited.
GetFilteredColumns	IEnumerable<object>	N/A	Returns an array of objects representing the columns that currently have active filters applied. Each object contains details about the filter and is associated with its corresponding column by the column's data field as the key. This allows you to identify which columns are being filtered and access the filter configurations for each.
GetGroups	IEnumerable<object>	N/A	Fetches an array of group objects that define the current grouping configuration of the grid. Each group object contains information about the field being grouped by, the group criteria, and any sub-grouping details, providing a comprehensive representation of how the grid's data is organized into groups.
GetHorizontalScrollMax	int	N/A	Returns the maximum horizontal scroll offset for the grid’s horizontal scrollbar. This value represents the furthest distance (in pixels) that the grid content can be scrolled horizontally. It is useful for programmatically setting, adjusting, or resetting the grid’s horizontal scroll position to ensure full content visibility or to align with specific scroll actions.
GetHorizontalScrollValue	int	N/A	Retrieves the current horizontal scroll offset of the grid's horizontal scrollbar, indicating how far the grid content has been scrolled from the left edge in pixels. This value can be used to determine the current scroll position or to programmatically control grid scrolling behavior.
GetIsExpandedAsync()	Task<bool>	'N/A'	Gets the &quot;IsExpanded&quot; property as Task&lt;bool&gt;.
GetPageIndexAsync()	Task<int>	'N/A'	Gets the &quot;PageIndex&quot; property as Task&lt;int&gt;.
GetRow	GridRow	object rowId	Returns the complete row object from the Grid for the row corresponding to the given row ID, including all its associated data and properties.Args: string rowId - The unique identifier of the row.
GetRow	GridRow	string rowId	Returns the complete row object from the Grid for the row corresponding to the given row ID, including all its associated data and properties.Args: string rowId - The unique identifier of the row.
GetRow	GridRow	int rowId	Returns the complete row object from the Grid for the row corresponding to the given row ID, including all its associated data and properties.Args: int rowId - The unique identifier of the row.
GetRowByIndex	GridRow	int rowIndex	Returns the Grid row object at the given zero-based row index, allowing access to all data and properties associated with that specific row. The index parameter should be an integer starting from 0, where 0 corresponds to the first row in the Grid.Args: int rowIndex - The zero-based index of the row in the grid.
GetRowData	object	object rowId	Fetches the original data source object directly linked to the given row ID, allowing access to all underlying data fields for that specific row as stored in the source dataset.Args: string rowId - The unique identifier of the row.
GetRowData	object	string rowId	Fetches the original data source object directly linked to the given row ID, allowing access to all underlying data fields for that specific row as stored in the source dataset.Args: string rowId - The unique identifier of the row.
GetRowData	object	int rowId	Fetches the original data source object directly linked to the given row ID, allowing access to all underlying data fields for that specific row as stored in the source dataset.Args: int rowId - The unique identifier of the row.
GetRowId	object	int rowIndex	Returns the unique identifier (row ID) associated with the row at the specified zero-based index. This allows you to access or reference a particular row in the data set by its position within the collection, where the first row has an index of 0.Args: int rowIndex - The zero-based index of the row.
GetRowProperty	object	object rowId, string propertyName	Retrieves the value of a specified property from a database row identified by its unique row ID. This function locates the row using the provided row ID and returns the value associated with the given property key within that row. If the property does not exist, it returns null or an appropriate default value.Args: string rowId - The unique identifier of the row.,string propertyName - The name of the row property to retrieve.
GetRowProperty	object	string rowId, string propertyName	Retrieves the value of a specified property from a database row identified by its unique row ID. This function locates the row using the provided row ID and returns the value associated with the given property key within that row. If the property does not exist, it returns null or an appropriate default value.Args: string rowId - The unique identifier of the row.,string propertyName - The name of the row property to retrieve.
GetRowProperty	object	int rowId, string propertyName	Retrieves the value of a specified property from a database row identified by its unique row ID. This function locates the row using the provided row ID and returns the value associated with the given property key within that row. If the property does not exist, it returns null or an appropriate default value.Args: int rowId - The unique identifier of the row.,string propertyName - The name of the row property to retrieve.
GetSelectedAsync()	Task<string>	'N/A'	Gets the &quot;Selected&quot; property as Task&lt;string&gt;.
GetSelectedCells	IEnumerable<object>	N/A	Returns an array of selected cells, where each cell is represented as an array structured as [row ID, column field, cell value]. <br/>- **Row ID**: The unique identifier for the row containing the cell. <br/>- **Column field**: The data field name (or key) corresponding to the column of the cell. <br/>- **Cell value**: The actual value contained within the cell. <br/><br/>This structure allows you to easily identify and access the position and value of each selected cell within the data set.
GetSelectedRowIds	IEnumerable<object>	N/A	Returns an array containing the unique identifiers (IDs) of all rows currently selected by the user within the grid component. Each element in the array corresponds to the ID of a selected row, allowing you to easily reference or manipulate the selected grid items programmatically.
GetSelectedRowIndexes	IEnumerable<object>	N/A	Returns an array containing the indices of the rows that are currently selected in the grid. Each element in the array represents the zero-based position of a selected row, allowing you to identify which rows the user has chosen. If no rows are selected, the array will be empty.
GetSelectedRows	IEnumerable<object>	N/A	Returns an array in which each element is a two-element array: the first element is the unique row ID, and the second element is the data object associated with that row. When operating in virtual mode, the data object may be empty if the row’s data has not yet been loaded, as data is retrieved on demand.
GetSelectedRowsData	IEnumerable<object>	N/A	Returns an array containing the data objects corresponding to each row currently selected in the grid. Each object in the array represents the underlying data for one selected row, allowing you to access and manipulate the specific records the user has chosen.
GetSelection	IEnumerable<object>	N/A	Returns an object representing the current selection state of the grid. This includes arrays listing the IDs of selected rows, the identifiers of selected columns, and the coordinates (row ID and data field) of selected cells. Additionally, it specifies the cell that is currently focused by providing its row ID and data field.
GetSortedColumns	object	N/A	Returns an object that details the columns currently sorted within a data table. Each key in the object corresponds to a column’s data field name. The value for each key is an object containing:<br/><br/>- `sortOrder`: Specifies the sorting direction for the column, either `'asc'` for ascending or `'desc'` for descending.<br/>- `sortIndex`: Indicates the column’s priority in multi-column sorting, with lower numbers representing higher priority.<br/><br/>This structure allows you to easily determine which columns are sorted, their order of precedence, and the sorting direction applied to each.
GetState	object	N/A	Retrieves a detailed JSON object that encapsulates the entire current state of the grid. This includes the active sorting and filtering criteria, column visibility and order, which rows are expanded, any grouping configurations, current pagination settings, and the selection state of rows or cells. The resulting state object is suitable for persisting the grid configuration (such as saving to local storage or a database) and can be used to completely restore the grid to the same state at a later time.
GetValueAsync()	Task<object>	'N/A'	Gets the &quot;Value&quot; property as Task&lt;object&gt;.
GetVerticalScrollMax	int	N/A	Returns the maximum allowable scroll position for the grid's vertical scrollbar. This value represents the greatest vertical offset to which users can scroll within the grid's content area. It can be used to determine the scrollable range or to programmatically set the vertical scrollbar to its lowest (bottom-most) position.
GetVerticalScrollValue	int	N/A	Returns the current vertical scroll position of the grid, representing the number of pixels the grid’s content has been scrolled vertically from the top. This value corresponds to the position of the grid's vertical scrollbar and can be used to determine how far users have scrolled down within the grid.
GetViewRows	IEnumerable<object>	N/A	Returns an array of row objects. By default, this represents the currently visible rows after any filters have been applied. When used in TreeGrid or Grouping mode, the array instead reflects the hierarchical structure of rows, including parent-child relationships, according to the current expand/collapse state of groups or tree nodes.
GetVisibleRows	IEnumerable<object>	N/A	Returns an array containing the data for all rows currently visible in the grid, after applying any active filters. Only rows that meet the filter criteria and are not hidden by filtering will be included in the array. This allows developers to access the up-to-date, filtered data as presented to the user in the grid interface.
GoToPage	void	int index	Programmatically navigates the grid to a specified page index, provided that paging is enabled. Use this method to set the current page of the grid, allowing you to jump to a particular page in response to user actions or custom logic. The page index is zero-based, where 0 refers to the first page."Args: int index - The zero-based index of the page to navigate to.
HasMenu	bool	N/A	Determines whether any column’s drop-down menu is currently open and visible within the grid component. This can be used to control grid interactions or UI behaviors that depend on the state of column drop-down menus.
HasSelectedRows	bool	N/A	Checks whether any rows in the grid are currently selected by the user. This property or method returns a boolean value: `true` if at least one row is selected, and `false` if no rows are selected. It is typically used to enable or disable actions that depend on row selection, such as editing or deleting entries.
HideDetail	void	object rowId	Conceals the details section for the specified row in the grid when the row details feature is enabled, effectively collapsing or hiding any expanded information or custom content associated with that row. This function ensures that only the main data for the row is visible, while any additional details remain hidden until explicitly shown again.Args: string rowId - The unique identifier of the row whose details should be hidden.
HideDetail	void	string rowId	Conceals the details section for the specified row in the grid when the row details feature is enabled, effectively collapsing or hiding any expanded information or custom content associated with that row. This function ensures that only the main data for the row is visible, while any additional details remain hidden until explicitly shown again.Args: string rowId - The unique identifier of the row whose details should be hidden.
HideDetail	void	int rowId	Conceals the details section for the specified row in the grid when the row details feature is enabled, effectively collapsing or hiding any expanded information or custom content associated with that row. This function ensures that only the main data for the row is visible, while any additional details remain hidden until explicitly shown again.Args: int rowId - The unique identifier of the row whose details should be hidden.
HighlightCell	void	object rowId, string dataField, string className	Emphasizes a specific cell within the grid, identified by its row ID and column data field. Invoking this method again on the same cell will toggle the highlight on or off. You can optionally specify a CSS class to apply custom styling to the highlighted cell, allowing for personalized visual differentiation.Args: string rowId - The unique identifier of the row containing the cell.,string dataField - The data field name of the column.,string className - Optional CSS class name for custom highlight styling.
HighlightCell	void	object rowId, string dataField	Emphasizes a specific cell within the grid, identified by its row ID and column data field. Invoking this method again on the same cell will toggle the highlight on or off. You can optionally specify a CSS class to apply custom styling to the highlighted cell, allowing for personalized visual differentiation.
HighlightCell	void	string rowId, string dataField, string className	Emphasizes a specific cell within the grid, identified by its row ID and column data field. Invoking this method again on the same cell will toggle the highlight on or off. You can optionally specify a CSS class to apply custom styling to the highlighted cell, allowing for personalized visual differentiation.Args: string rowId - The unique identifier of the row containing the cell.,string dataField - The data field name of the column.,string className - Optional CSS class name for custom highlight styling.
HighlightCell	void	string rowId, string dataField	Emphasizes a specific cell within the grid, identified by its row ID and column data field. Invoking this method again on the same cell will toggle the highlight on or off. You can optionally specify a CSS class to apply custom styling to the highlighted cell, allowing for personalized visual differentiation.
HighlightCell	void	int rowId, string dataField, string className	Emphasizes a specific cell within the grid, identified by its row ID and column data field. Invoking this method again on the same cell will toggle the highlight on or off. You can optionally specify a CSS class to apply custom styling to the highlighted cell, allowing for personalized visual differentiation.Args: int rowId - The unique identifier of the row containing the cell.,string dataField - The data field name of the column.,string className - Optional CSS class name for custom highlight styling.
HighlightCell	void	int rowId, string dataField	Emphasizes a specific cell within the grid, identified by its row ID and column data field. Invoking this method again on the same cell will toggle the highlight on or off. You can optionally specify a CSS class to apply custom styling to the highlighted cell, allowing for personalized visual differentiation.
HighlightColumn	void	string dataField	Highlights all cells within the column corresponding to the specified data field. If this method is called again with the same data field, it toggles the highlight by removing it if already applied, or reapplying it if previously removed.Args: string dataField - The data field name of the column to highlight.
HighlightRow	void	object rowId, string className	Enhances visibility of the table row corresponding to the provided row ID by applying a highlight effect. Invoking this method a second time on the same row will remove the highlight, effectively toggling its state. Optionally, you can supply a custom CSS class to override the default highlight styling for tailored appearance.Args: string rowId - The unique identifier of the row to highlight.,string className - Optional CSS class name for custom highlight styling.
HighlightRow	void	object rowId	Enhances visibility of the table row corresponding to the provided row ID by applying a highlight effect. Invoking this method a second time on the same row will remove the highlight, effectively toggling its state. Optionally, you can supply a custom CSS class to override the default highlight styling for tailored appearance.
HighlightRow	void	string rowId, string className	Enhances visibility of the table row corresponding to the provided row ID by applying a highlight effect. Invoking this method a second time on the same row will remove the highlight, effectively toggling its state. Optionally, you can supply a custom CSS class to override the default highlight styling for tailored appearance.Args: string rowId - The unique identifier of the row to highlight.,string className - Optional CSS class name for custom highlight styling.
HighlightRow	void	string rowId	Enhances visibility of the table row corresponding to the provided row ID by applying a highlight effect. Invoking this method a second time on the same row will remove the highlight, effectively toggling its state. Optionally, you can supply a custom CSS class to override the default highlight styling for tailored appearance.
HighlightRow	void	int rowId, string className	Enhances visibility of the table row corresponding to the provided row ID by applying a highlight effect. Invoking this method a second time on the same row will remove the highlight, effectively toggling its state. Optionally, you can supply a custom CSS class to override the default highlight styling for tailored appearance.Args: int rowId - The unique identifier of the row to highlight.,string className - Optional CSS class name for custom highlight styling.
HighlightRow	void	int rowId	Enhances visibility of the table row corresponding to the provided row ID by applying a highlight effect. Invoking this method a second time on the same row will remove the highlight, effectively toggling its state. Optionally, you can supply a custom CSS class to override the default highlight styling for tailored appearance.
InsertRow	void	object data, int index, object callback	Adds a new row to the grid using the provided data object. If batch editing mode is active, the row will be added only as a pending change and will not be permanently committed to the data source until the batch is saved. You may optionally specify the index at which the new row should be inserted; if omitted, the row will be added at the default position (usually at the end). Additionally, you can provide a callback function that will be executed after the row has been successfully added to the grid.Args: object data - The data object for the new row, matching the grid's data source schema.,int index - The zero-based index at which to insert the new row. Defaults to the last position if omitted.,object callback - Optional callback function executed after the row is inserted, receiving the newly added row object.
InsertRow	void	object data	Adds a new row to the grid using the provided data object. If batch editing mode is active, the row will be added only as a pending change and will not be permanently committed to the data source until the batch is saved. You may optionally specify the index at which the new row should be inserted; if omitted, the row will be added at the default position (usually at the end). Additionally, you can provide a callback function that will be executed after the row has been successfully added to the grid.
LastPage	void	N/A	Navigates directly to the final page of the data grid when paging functionality is enabled, allowing users to quickly access the last set of records displayed in the grid.
LoadState	object	object state	Restored a previously saved grid state by accepting either the name of the saved state or a state object. The state object can include detailed settings such as current sorting and filtering criteria, column visibility and order, expanded or collapsed row status, grouping configurations, paging information (such as current page and page size), and selected rows. This allows the grid to be reconfigured exactly as it was when the state was saved, providing a consistent user experience across sessions.Args: object state - A state name (string) previously saved or a state object representing the grid configuration to load.
NextPage	void	N/A	Advances to the next page of data in the grid when paging functionality is enabled. If the grid is currently displaying the last available page, this action will have no effect and the page will remain unchanged.
OpenContextMenu	void	int left, int top	Displays the context menu at the given (left, top) screen coordinates. Ensure that context menu functionality is enabled in the grid settings for this method to work.Args: int left - The left position (in pixels) where the context menu should appear.,int top - The top position (in pixels) where the context menu should appear.
OpenDropDown	void	N/A	Displays the grid’s drop-down user interface when the 'dropDownMode' property is set to true, allowing users to interact with additional grid options or filters presented within the drop-down.
OpenMenu	void	string dataField	Displays the drop-down menu associated with the column specified by the provided data field identifier, allowing users to access additional actions or settings related to that column.Args: string dataField - The data field name of the column whose menu to open.
PrevPage	void	N/A	Triggers navigation to the previous page in the grid when paging functionality is enabled. If the grid is currently displaying the first page, the operation is ignored and the page remains unchanged. This ensures that navigation does not attempt to move before the first available page.
Print	void	N/A	Generates a printed version of the Grid’s data using the configuration specified in the "dataExport" property. During printing, the Grid automatically hides scrollbars and adjusts its width and height to ensure that all rows and columns are fully visible on the page, regardless of their original size. This ensures that the entire content of the Grid is included in the printout without any truncation or the need for scrolling. To customize aspects such as page layout, formatting, or which data is included in the print output, adjust the parameters within the "dataExport" property.
Refresh	void	'N/A'	Refreshes the Blazor Component. Performs a layout of the HTML Elements and recalculates the measurements.
Refresh	void	N/A	Enhances the Grid display by refreshing its layout to reflect the latest property values, dynamically updating only the necessary elements. This approach optimizes performance by avoiding a complete teardown and reconstruction of all Grid elements, ensuring a smoother and more efficient user experience.
RefreshSort	void	N/A	Applies the current sorting settings again to the data and updates the Grid display to reflect any changes, ensuring the data is presented according to the latest sorting configuration.
RefreshView	void	N/A	Refreshes only the cells that are currently visible within the Grid’s viewport, rather than updating the entire Grid. This is especially useful for implementing real-time updates or live data feeds, as it enables efficient, seamless rendering of new cell values without triggering a full Grid refresh or losing the user's scroll position.
RemoveFilter	void	string dataField, bool refreshFilters	Removes the filter currently applied to the specified column. Optionally, you can delay the filter refresh process, allowing you to remove filters from multiple columns before triggering an update. This helps optimize performance when batch-processing multiple filter removals.Args: string dataField - The data field of the column from which to remove the filter, e.g., 'firstName'.,bool refreshFilters - If set to false, delays the filter refresh to allow multiple filters to be removed before updating the Grid.
RemoveFilter	void	string dataField	Removes the filter currently applied to the specified column. Optionally, you can delay the filter refresh process, allowing you to remove filters from multiple columns before triggering an update. This helps optimize performance when batch-processing multiple filter removals.
RemoveGroup	void	string dataField	Removes grouping from the Grid for the specified data field. This method is only applicable when grouping functionality is enabled in the Grid. When called, it will ungroup the records currently grouped by the given field, and the Grid will update to display the data without that grouping criterion.Args: string dataField - The data field of the group to remove, e.g., 'firstName'.
RemoveSort	void	string dataField	Removes any active sorting from the specified column. Use this method to clear the sort order applied to a particular data field, returning the column to its default, unsorted state. This is useful when you want to reset or update the sorting configuration for individual columns within a data table.Args: string dataField - The data field of the column whose sorting you want to remove, e.g., 'firstName'.
Render	void	'N/A'	Re-renders the Blazor Component. This method will make a full re-render.
Render	void	N/A	Triggers a full re-render of the Grid, similar to when it is first initialized. This method reconstructs all underlying HTML elements for rows, columns, and cells from scratch, ensuring a fresh and accurate representation of the data. After rebuilding these elements, it also updates and refreshes the Grid layout to reflect any structural changes. This is useful when foundational data or configuration has changed and a partial update is not sufficient.
ReorderColumns	void	object dataField, object referenceDataField, bool insertAfter	Reorders two columns in the Grid by moving the specified source column to a new position either before or after the target reference column. This allows for customizable column arrangements by programmatically shifting the position of columns within the Grid.Args: string dataField - The data field or index of the column to move.,string referenceDataField - The data field or index of the target column used as reference for repositioning.,bool insertAfter - If true, inserts the first column after the reference column; otherwise, inserts it before.
ReorderColumns	void	object dataField, object referenceDataField	Reorders two columns in the Grid by moving the specified source column to a new position either before or after the target reference column. This allows for customizable column arrangements by programmatically shifting the position of columns within the Grid.
ReorderColumns	void	string dataField, string referenceDataField, bool insertAfter	Reorders two columns in the Grid by moving the specified source column to a new position either before or after the target reference column. This allows for customizable column arrangements by programmatically shifting the position of columns within the Grid.Args: string dataField - The data field or index of the column to move.,string referenceDataField - The data field or index of the target column used as reference for repositioning.,bool insertAfter - If true, inserts the first column after the reference column; otherwise, inserts it before.
ReorderColumns	void	string dataField, string referenceDataField	Reorders two columns in the Grid by moving the specified source column to a new position either before or after the target reference column. This allows for customizable column arrangements by programmatically shifting the position of columns within the Grid.
ReorderColumns	void	int dataField, int referenceDataField, bool insertAfter	Reorders two columns in the Grid by moving the specified source column to a new position either before or after the target reference column. This allows for customizable column arrangements by programmatically shifting the position of columns within the Grid.Args: string dataField - The data field or index of the column to move.,int referenceDataField - The data field or index of the target column used as reference for repositioning.,bool insertAfter - If true, inserts the first column after the reference column; otherwise, inserts it before.
ReorderColumns	void	int dataField, int referenceDataField	Reorders two columns in the Grid by moving the specified source column to a new position either before or after the target reference column. This allows for customizable column arrangements by programmatically shifting the position of columns within the Grid.
ResetState	void	N/A	Restores the Grid to its original default configuration by removing all user-applied settings, including sorting, filtering, grouping, and selected rows or cells. This action clears any user interactions, ensuring the Grid displays data with no custom modifications.
RevertBatchEdit	void	N/A	Reverts the Grid to its previous state by discarding all unsaved batch editing changes made by the user. Any modifications entered during the current batch editing session will be canceled, restoring the Grid’s data to its last committed state.
SaveBatchEdit	void	N/A	Saves and applies all batch editing changes made by the end-user, persisting the updates permanently to the Grid's underlying data source. This operation commits all modifications (such as additions, deletions, and edits) performed during the batch editing session, ensuring that the Grid data source accurately reflects the latest user input.
SaveState	object	string name	Captures and returns the current state of the Grid as a comprehensive JSON object. The state includes details such as applied sorting and filtering criteria, columns configuration (order, visibility, and sizing), currently expanded rows, grouping settings, paging information (current page, page size), and user selections. Optionally, you can provide a name parameter to uniquely identify and reference the saved state for future retrieval or restoration.Args: string name - Optional name to associate with the saved state.
SaveState	object	N/A	Captures and returns the current state of the Grid as a comprehensive JSON object. The state includes details such as applied sorting and filtering criteria, columns configuration (order, visibility, and sizing), currently expanded rows, grouping settings, paging information (current page, page size), and user selections. Optionally, you can provide a name parameter to uniquely identify and reference the saved state for future retrieval or restoration.
Select	void	object rowId, string dataField	Specifies the selection of a particular row, column, or cell within a data table. If a data field (representing a column) is provided along with a row identifier, the selection targets a specific cell at the intersection of the given row and column. If only a row identifier is supplied without a data field, the entire row is selected. Similarly, providing only a data field without a row identifier selects the entire column.Args: string rowId - The identifier of the row to select.,string dataField - Optional data field of the column to select a specific cell.
Select	void	object rowId	Specifies the selection of a particular row, column, or cell within a data table. If a data field (representing a column) is provided along with a row identifier, the selection targets a specific cell at the intersection of the given row and column. If only a row identifier is supplied without a data field, the entire row is selected. Similarly, providing only a data field without a row identifier selects the entire column.
Select	void	string rowId, string dataField	Specifies the selection of a particular row, column, or cell within a data table. If a data field (representing a column) is provided along with a row identifier, the selection targets a specific cell at the intersection of the given row and column. If only a row identifier is supplied without a data field, the entire row is selected. Similarly, providing only a data field without a row identifier selects the entire column.Args: string rowId - The identifier of the row to select.,string dataField - Optional data field of the column to select a specific cell.
Select	void	string rowId	Specifies the selection of a particular row, column, or cell within a data table. If a data field (representing a column) is provided along with a row identifier, the selection targets a specific cell at the intersection of the given row and column. If only a row identifier is supplied without a data field, the entire row is selected. Similarly, providing only a data field without a row identifier selects the entire column.
Select	void	int rowId, string dataField	Specifies the selection of a particular row, column, or cell within a data table. If a data field (representing a column) is provided along with a row identifier, the selection targets a specific cell at the intersection of the given row and column. If only a row identifier is supplied without a data field, the entire row is selected. Similarly, providing only a data field without a row identifier selects the entire column.Args: int rowId - The identifier of the row to select.,string dataField - Optional data field of the column to select a specific cell.
Select	void	int rowId	Specifies the selection of a particular row, column, or cell within a data table. If a data field (representing a column) is provided along with a row identifier, the selection targets a specific cell at the intersection of the given row and column. If only a row identifier is supplied without a data field, the entire row is selected. Similarly, providing only a data field without a row identifier selects the entire column.
SelectAllRows	void	N/A	Selects every row that is currently visible in the Grid, including only those rows that meet the active filters, sorting, and pagination settings. Hidden or filtered-out rows are not selected.
SelectCells	void	IEnumerable<object> rowIds, string[] dataFields	Allows you to select multiple cells within a grid by specifying arrays of row indices (cell ids) and corresponding column data fields. <br/>For example: `grid.selectCells([0, 1, 2], ['firstName', 'quantity', 'date']);` <br/>This will select the cells located at the intersection of:<br/>- Row 0 and the 'firstName' column,<br/>- Row 1 and the 'quantity' column,<br/>- Row 2 and the 'date' column.<br/><br/>Each element in the id array matches with the element in the dataFields array by position, ensuring precise cell selection across different rows and columns. This method is useful for batch selection or applying simultaneous actions to multiple, non-contiguous cells.Args: IEnumerable<object> rowIds - Array of row ids,string dataFields - Array of data fields.
SelectCellsByQuery	void	string query	Selects grid cells based on a query string. <br/><br/>- Example 1: `grid.selectCellsByQuery('nancy');` selects all cells in the grid whose value is exactly 'nancy'.<br/>- Example 2: `grid.selectCellsByQuery('nancy, davolio');` selects all cells within rows where both 'nancy' and 'davolio' values appear in any columns of the same row.<br/><br/>The query can be a single value or a comma-separated list of values. When multiple values are specified, only rows containing all the specified values (regardless of column order) will have their cells selected.Args: string query - Search query
SelectRange	void	object rowId, string dataField, object endRowId, string endDataField	Selects a rectangular range of cells within the grid, defined by specifying both the starting and ending row IDs as well as the data field keys (columns). The selection includes all cells that fall within the rectangle formed by these start and end points. The behavior and outcome of this selection may vary based on the current selection mode of the Grid component (for example, whether it supports cell, row, or column selection)."Args: string rowId - The starting row ID of the selection range.,string dataField - The starting column data field of the selection range.,string endRowId - The ending row ID of the selection range.,string endDataField - The ending column data field of the selection range.
SelectRange	void	string rowId, string dataField, string endRowId, string endDataField	Selects a rectangular range of cells within the grid, defined by specifying both the starting and ending row IDs as well as the data field keys (columns). The selection includes all cells that fall within the rectangle formed by these start and end points. The behavior and outcome of this selection may vary based on the current selection mode of the Grid component (for example, whether it supports cell, row, or column selection)."Args: string rowId - The starting row ID of the selection range.,string dataField - The starting column data field of the selection range.,string endRowId - The ending row ID of the selection range.,string endDataField - The ending column data field of the selection range.
SelectRange	void	int rowId, string dataField, int endRowId, string endDataField	Selects a rectangular range of cells within the grid, defined by specifying both the starting and ending row IDs as well as the data field keys (columns). The selection includes all cells that fall within the rectangle formed by these start and end points. The behavior and outcome of this selection may vary based on the current selection mode of the Grid component (for example, whether it supports cell, row, or column selection)."Args: int rowId - The starting row ID of the selection range.,string dataField - The starting column data field of the selection range.,int endRowId - The ending row ID of the selection range.,string endDataField - The ending column data field of the selection range.
SelectRows	void	IEnumerable<object> rowId	Selects multiple rows by accepting an array of row IDs, allowing you to specify and manipulate several rows simultaneously based on their unique identifiers.Args: IEnumerable<object> rowId - Array of row IDs to select.
SelectRows	void	string[] rowId	Selects multiple rows by accepting an array of row IDs, allowing you to specify and manipulate several rows simultaneously based on their unique identifiers.Args: string[] rowId - Array of row IDs to select.
SelectRows	void	int[] rowId	Selects multiple rows by accepting an array of row IDs, allowing you to specify and manipulate several rows simultaneously based on their unique identifiers.Args: int[] rowId - Array of row IDs to select.
SelectRowsByIndex	void	int[] rowIndex	Enhances selection functionality by allowing users to select multiple rows within the Grid component, using their zero-based index positions. This means you can specify one or more row indices (starting from 0 for the first row) to programmatically select the corresponding rows in the Grid.Args: int[] rowIndex - An array of zero-based row indexes to select.
SelectRowsByQuery	void	string query, string dataField, string condition	Selects rows from a dataset based on a specified query expression. This allows you to filter rows by applying conditions to the values in one or more columns. Supported conditions include equality (equals), partial matches (contains), comparison operators (greater than, less than), prefix matching (starts with), and more. The query expression enables flexible filtering, so only rows that meet the defined criteria are returned.Args: string query - The search query or value to filter by.,string dataField - Optional column data field to apply the query against.,string condition - Optional condition operator. Supported values include '=', 'EQUAL', '<>', 'NOT_EQUAL', '!=', '<', 'LESS_THAN', '>', 'GREATER_THAN', '<=', 'LESS_THAN_OR_EQUAL', '>=', 'GREATER_THAN_OR_EQUAL', 'starts with', 'STARTS_WITH', 'ends with', 'ENDS_WITH', '', 'EMPTY', 'CONTAINS', 'DOES_NOT_CONTAIN', 'NULL', 'NOT_NULL'.
SelectRowsByQuery	void	string query	Selects rows from a dataset based on a specified query expression. This allows you to filter rows by applying conditions to the values in one or more columns. Supported conditions include equality (equals), partial matches (contains), comparison operators (greater than, less than), prefix matching (starts with), and more. The query expression enables flexible filtering, so only rows that meet the defined criteria are returned.
SelectRowsRange	void	object rowId, object endRowId	Selects all consecutive rows, inclusive, between the specified start and end row IDs. Both the start and end IDs are included in the selection, and only rows with IDs that fall within this continuous range will be selected.Args: string rowId - The starting row ID of the selection range.,string endRowId - The ending row ID of the selection range.
SelectRowsRange	void	string rowId, string endRowId	Selects all consecutive rows, inclusive, between the specified start and end row IDs. Both the start and end IDs are included in the selection, and only rows with IDs that fall within this continuous range will be selected.Args: string rowId - The starting row ID of the selection range.,string endRowId - The ending row ID of the selection range.
SelectRowsRange	void	int rowId, int endRowId	Selects all consecutive rows, inclusive, between the specified start and end row IDs. Both the start and end IDs are included in the selection, and only rows with IDs that fall within this continuous range will be selected.Args: int rowId - The starting row ID of the selection range.,int endRowId - The ending row ID of the selection range.
SetCellStyle	void	object rowId, string dataField, object rowStyle	Enhances a specific table cell's appearance by applying custom CSS styles, targeting the cell using both its unique rowId and the dataField (column identifier). You can specify a range of style properties, including background color, text color, font size, font family, text decoration, font style, and font weight, allowing precise control over the cell’s visual presentation.Args: string rowId - The unique identifier of the row containing the cell.,string dataField - The dataField (column) name of the cell to style.,object rowStyle - An object specifying CSS style properties and values to apply to the specific cell.
SetCellValue	void	object rowId, string dataField, object value	Assigns a new value to a specific cell within a data table, targeting the cell by its unique row ID and the corresponding column's data field name. This allows precise updating of individual cell contents based on row and column identifiers.Args: string rowId - The unique identifier of the row containing the cell.,string dataField - The data field of the column where the cell is located (e.g., 'firstName').,object value - The new value to assign to the cell.
SetCellValue	void	string rowId, string dataField, string value	Assigns a new value to a specific cell within a data table, targeting the cell by its unique row ID and the corresponding column's data field name. This allows precise updating of individual cell contents based on row and column identifiers.Args: string rowId - The unique identifier of the row containing the cell.,string dataField - The data field of the column where the cell is located (e.g., 'firstName').,string value - The new value to assign to the cell.
SetCellValue	void	int rowId, string dataField, int value	Assigns a new value to a specific cell within a data table, targeting the cell by its unique row ID and the corresponding column's data field name. This allows precise updating of individual cell contents based on row and column identifiers.Args: int rowId - The unique identifier of the row containing the cell.,string dataField - The data field of the column where the cell is located (e.g., 'firstName').,int value - The new value to assign to the cell.
SetColumnProperty	void	string dataField, string propertyName, object value	Sets or updates a specific property of a column identified by its dataField. This function allows you to dynamically modify column settings, such as freezing the column, toggling its visibility, adjusting its width, and altering other configurable attributes at runtime. Use this method to programmatically change how individual columns are displayed or behave within your data grid or table component.Args: string dataField - The dataField identifier of the column (e.g., 'firstName').,string propertyName - The name of the column property to set (e.g., 'freeze', 'visible', 'width').,object value - The new value to assign to the specified column property.
SetColumns	void	GridColumn[] columns	Sets the columns displayed in the Grid to a new set defined by the provided argument. When 'setColumns' is called, the Grid compares the new columns array with the currently displayed columns. It will add any new columns, retain existing columns that are still present, and remove columns that are not included in the new array. After updating the columns, the Grid automatically redraws all column headers and refreshes all rows to reflect the changes. Importantly, any state associated with existing columns—such as sort order, filters, column width, and other configurable options—will be preserved for columns that remain after the update. This ensures that users do not lose their settings when columns are changed dynamically.Args: GridColumn[] columns - Columns array.
SetDropDownLabel	void	string label	Specifies the label text displayed for the Grid component when the 'dropDownMode' property is enabled. This label helps users identify the purpose or content of the Grid when it appears in drop-down mode.Args: string label - The label to be displayed in the dropdown button.
SetHorizontalScrollValue	void	int value	Sets the current position of the horizontal scrollbar within a scrollable container. This method allows you to programmatically adjust the horizontal scroll offset, enabling smooth navigation or custom scroll behavior. It can be used in combination with getHorizontalScrollValue to retrieve the current scroll position, and with getHorizontalScrollMax to determine the maximum scrollable distance. This is useful for implementing features such as custom scrolling controls, restoring previous scroll positions, or synchronizing scrolling across multiple elements.Args: int value - The new scroll position
SetLocale	void	string locale, object messages	Sets the locale of a component.Args: string locale - The locale abbreviation. For example: 'de'.,object messages - Object containing the locale messages.
SetLocale	void	string locale	Sets the locale of a component.
SetRowProperty	void	object rowId, string propertyName, object value	Updates or sets a specific property of a table row identified by its unique rowId. This function allows you to dynamically modify row attributes—for example, toggling the frozen state, applying custom styling, or adding arbitrary metadata—enabling flexible and responsive UI changes at the row level.Args: string rowId - The unique identifier of the row to modify.,string propertyName - The name of the row property to set (e.g., 'freeze', 'expanded', 'customProperty').,object value - The new value to assign to the specified row property.
SetRowStyle	void	object rowId, object rowStyle	Allows you to apply custom CSS styles to a specific table row, identified by its unique rowId. Supported style properties include background color, text color, font size, font family, text decoration, font style, and font weight. This enables granular control over the appearance of individual rows in your table, ensuring consistency with your application's design requirements.Args: string rowId - The unique identifier of the row to style.,object rowStyle - An object specifying CSS style properties and values to apply to the entire row.
SetVerticalScrollValue	void	int value	Sets the current position of the vertical scrollbar within a scrollable container or component. This method allows you to programmatically control the vertical scroll offset, typically specified in pixels or logical units from the top of the content. It can be used in conjunction with the getVerticalScrollValue method to retrieve the current scroll position, and with getVerticalScrollMax to determine the maximum scrollable value. This is useful for synchronizing scrolling behavior, implementing custom scroll controls, or restoring a previous scroll position.Args: int value - The new scroll position
ShowCellMessage	void	object rowId, string dataField, string value	Displays a visually distinct overlay message positioned directly beneath a specific cell. This method is ideal for providing contextual onboarding tips, user guidance, or delivering custom messages tailored to the user's current interaction. It enhances user experience by presenting timely and relevant information without interrupting workflow.Args: string rowId - row bound id,string dataField - column bound data field. For example, if you have a column with dataField: 'firstName', set 'firstName' here.,string value - The message to be shown below the cell
ShowCellMessage	void	string rowId, string dataField, string value	Displays a visually distinct overlay message positioned directly beneath a specific cell. This method is ideal for providing contextual onboarding tips, user guidance, or delivering custom messages tailored to the user's current interaction. It enhances user experience by presenting timely and relevant information without interrupting workflow.Args: string rowId - row bound id,string dataField - column bound data field. For example, if you have a column with dataField: 'firstName', set 'firstName' here.,string value - The message to be shown below the cell
ShowCellMessage	void	int rowId, string dataField, string value	Displays a visually distinct overlay message positioned directly beneath a specific cell. This method is ideal for providing contextual onboarding tips, user guidance, or delivering custom messages tailored to the user's current interaction. It enhances user experience by presenting timely and relevant information without interrupting workflow.Args: int rowId - row bound id,string dataField - column bound data field. For example, if you have a column with dataField: 'firstName', set 'firstName' here.,string value - The message to be shown below the cell
ShowDetail	void	object rowId	Renders an in-depth view of a selected row when the row details feature is activated in the grid configuration. This allows users to access and interact with additional information or actions related to the chosen row.Args: string rowId - row bound id
ShowDetail	void	string rowId	Renders an in-depth view of a selected row when the row details feature is activated in the grid configuration. This allows users to access and interact with additional information or actions related to the chosen row.Args: string rowId - row bound id
ShowDetail	void	int rowId	Renders an in-depth view of a selected row when the row details feature is activated in the grid configuration. This allows users to access and interact with additional information or actions related to the chosen row.Args: int rowId - row bound id
ShowSidePanel	void	object content, int width, object callback	Displays the Grid's side panel, providing access to additional settings, filters, and customization options related to the Grid's content and layout.Args: object content - This is the content which will be displayed in the side panel. It can be String, HTML Element, HTML Template Element or Component,string width - This is the width of the side panel,object callback - Function called when the panel is opened. It can be used for dynamically showing content and initializing it.
ShowSidePanel	void	object content	Displays the Grid's side panel, providing access to additional settings, filters, and customization options related to the Grid's content and layout.
SortBy	void	string dataField, string sortOrder	Applies sorting to the Grid based on the specified data field. You can either add sorting by providing a valid sortOrder (such as 'asc' or 'desc'), or remove sorting from a column by setting the sortOrder parameter to null. This allows dynamic adjustment of Grid sorting criteria, enabling users to sort data as needed or clear sorting on individual columns.Args: string dataField - The data field of the column to sort, e.g., 'firstName'.,string sortOrder - Sort order to apply: 'asc' for ascending, 'desc' for descending, or null to remove sorting.
SortBy	void	string dataField, string sortOrder	Applies sorting to the Grid based on the specified data field. You can either add sorting by providing a valid sortOrder (such as 'asc' or 'desc'), or remove sorting from a column by setting the sortOrder parameter to null. This allows dynamic adjustment of Grid sorting criteria, enabling users to sort data as needed or clear sorting on individual columns.Args: string dataField - The data field of the column to sort, e.g., 'firstName'.,string sortOrder - Sort order to apply: 'asc' for ascending, 'desc' for descending, or null to remove sorting.
StateHasChanged	void	'N/A'	Refreshes the state and Re-renders the Blazor Component, if necessary.
SwapColumns	void	object dataField, object referenceDataField	Swaps the positions of two specified columns within the Grid layout, effectively changing their order of appearance. This operation updates the Grid so that the selected columns exchange places, while the data and structure of other columns remain unchanged.Args: string dataField - The data field or index of the first column.,string referenceDataField - The data field or index of the second column.
SwapColumns	void	string dataField, string referenceDataField	Swaps the positions of two specified columns within the Grid layout, effectively changing their order of appearance. This operation updates the Grid so that the selected columns exchange places, while the data and structure of other columns remain unchanged.Args: string dataField - The data field or index of the first column.,string referenceDataField - The data field or index of the second column.
SwapColumns	void	int dataField, int referenceDataField	Swaps the positions of two specified columns within the Grid layout, effectively changing their order of appearance. This operation updates the Grid so that the selected columns exchange places, while the data and structure of other columns remain unchanged.Args: string dataField - The data field or index of the first column.,int referenceDataField - The data field or index of the second column.
ToggleRow	void	object rowId	Toggles the expanded or collapsed state of a TreeGrid row specified by the provided row ID. If the target row is currently collapsed, this action will expand it to reveal its child rows. Conversely, if the row is expanded, it will collapse and hide any child rows. Use this function to dynamically show or hide hierarchical data within the TreeGrid based on user interaction or programmatic control.Args: string rowId - The ID of the row to toggle expand/collapse state.
ToggleRow	void	string rowId	Toggles the expanded or collapsed state of a TreeGrid row specified by the provided row ID. If the target row is currently collapsed, this action will expand it to reveal its child rows. Conversely, if the row is expanded, it will collapse and hide any child rows. Use this function to dynamically show or hide hierarchical data within the TreeGrid based on user interaction or programmatic control.Args: string rowId - The ID of the row to toggle expand/collapse state.
ToggleRow	void	int rowId	Toggles the expanded or collapsed state of a TreeGrid row specified by the provided row ID. If the target row is currently collapsed, this action will expand it to reveal its child rows. Conversely, if the row is expanded, it will collapse and hide any child rows. Use this function to dynamically show or hide hierarchical data within the TreeGrid based on user interaction or programmatic control.Args: int rowId - The ID of the row to toggle expand/collapse state.
Transpose	void	string dataField, int columnWidth, object initColumn	Transposes the Grid.Args: string dataField - The dataField of the Column.,string columnWidth - The width of the Column.,object initColumn - callback for set up of the column.
Transpose	void	string dataField	Transposes the Grid.
UncheckAllRows	void	N/A	Resets the checked state of all rows in a TreeGrid or GroupingGrid by setting every checkbox to unchecked (`false`). This action ensures that no rows remain selected or checked, effectively deselecting all items in the grid.
UncheckRow	void	object rowId	Unchecks a specific row in the TreeGrid by setting its associated checkbox to an unchecked (false) state. This visually updates the checkbox in the UI and updates the row’s checked status in the underlying data model.Args: string rowId - row bound id
UncheckRow	void	string rowId	Unchecks a specific row in the TreeGrid by setting its associated checkbox to an unchecked (false) state. This visually updates the checkbox in the UI and updates the row’s checked status in the underlying data model.Args: string rowId - row bound id
UncheckRow	void	int rowId	Unchecks a specific row in the TreeGrid by setting its associated checkbox to an unchecked (false) state. This visually updates the checkbox in the UI and updates the row’s checked status in the underlying data model.Args: int rowId - row bound id
Unselect	void	object rowId, string dataField	Deselects a previously selected row, cell, or column within the data grid, removing any associated highlight or selection state.Args: string rowId - row bound id,string dataField - column bound data field. For example, if you have a column with dataField: 'firstName', set 'firstName' here.
Unselect	void	object rowId	Deselects a previously selected row, cell, or column within the data grid, removing any associated highlight or selection state.
Unselect	void	string rowId, string dataField	Deselects a previously selected row, cell, or column within the data grid, removing any associated highlight or selection state.Args: string rowId - row bound id,string dataField - column bound data field. For example, if you have a column with dataField: 'firstName', set 'firstName' here.
Unselect	void	string rowId	Deselects a previously selected row, cell, or column within the data grid, removing any associated highlight or selection state.
Unselect	void	int rowId, string dataField	Deselects a previously selected row, cell, or column within the data grid, removing any associated highlight or selection state.Args: int rowId - row bound id,string dataField - column bound data field. For example, if you have a column with dataField: 'firstName', set 'firstName' here.
Unselect	void	int rowId	Deselects a previously selected row, cell, or column within the data grid, removing any associated highlight or selection state.
UpdateRow	void	object rowId, object data, object callback	Updates the data of a specific row identified by its unique row ID. When batch editing mode is enabled, the changes to the row are temporarily staged and will not be permanently saved to the data source until the user explicitly commits or saves the batch of edits. This ensures that multiple changes can be reviewed and either all applied or discarded together, rather than being immediately written to the underlying data.Args: string rowId - row bound id,object data - row data matching the data source,object callback - Sets a callback function, which is called after the row is updated. The callback's argument is the updated row.
UpdateRow	void	object rowId, object data	Updates the data of a specific row identified by its unique row ID. When batch editing mode is enabled, the changes to the row are temporarily staged and will not be permanently saved to the data source until the user explicitly commits or saves the batch of edits. This ensures that multiple changes can be reviewed and either all applied or discarded together, rather than being immediately written to the underlying data.

Grid Events

Name	Type	Description	Event Detail
OnBeginEdit	EventCallback<Event>	This event is fired when a cell transitions into edit mode. Within the event handler, you can prevent the editing action for specific cells, rows, or columns by invoking "event.preventDefault()". This allows you to control which cells are editable based on custom logic or application requirements.	string id- The unique identifier of the edited row., string dataField- The data field (column) associated with the edited cell., dynamic row- The edited row's full configuration object., dynamic column- The column configuration of the edited cell., dynamic cell- The edited cell object., object data- The complete data record of the edited row., object value- The current value of the edited cell.
BeginEdited	event GridBeginEditedEventHandler	This event is fired when a cell transitions into edit mode. Within the event handler, you can prevent the editing action for specific cells, rows, or columns by invoking "event.preventDefault()". This allows you to control which cells are editable based on custom logic or application requirements.	GridBeginEditedEventArgs
OnBatchChange	EventCallback<Event>	Triggered when a user confirms a batch action by clicking the 'OK' button in a Grid header dropdown. Typical actions include column customization, applying sorting, or setting filters. This event signifies that the changes selected in the dropdown have been finalized and applied to the Grid.	string type- The type of dropdown where the batch change occurred. Possible values: 'filter', 'sort', 'search', 'group', 'format', 'customize'.
BatchChanged	event GridBatchChangedEventHandler	Triggered when a user confirms a batch action by clicking the 'OK' button in a Grid header dropdown. Typical actions include column customization, applying sorting, or setting filters. This event signifies that the changes selected in the dropdown have been finalized and applied to the Grid.	GridBatchChangedEventArgs
OnBatchCancel	EventCallback<Event>	Triggered when a user clicks the 'Cancel' button in the header dropdown of a Grid, thereby aborting an ongoing batch operation. This event allows you to handle cleanup or UI updates when a batch process is intentionally stopped before completion.	string type- The type of dropdown where the cancellation occurred. Possible values: 'filter', 'sort', 'search', 'group', 'format', 'customize'.
BatchCanceled	event GridBatchCanceledEventHandler	Triggered when a user clicks the 'Cancel' button in the header dropdown of a Grid, thereby aborting an ongoing batch operation. This event allows you to handle cleanup or UI updates when a batch process is intentionally stopped before completion.	GridBatchCanceledEventArgs
OnChange	EventCallback<Event>	Fires whenever the selection within the Grid changes. During drag selection, this event is emitted both at the beginning of the drag operation and again when the selection is completed, allowing you to respond to both initiation and completion of drag-based selection changes.	bool started- Set to "true" when selection begins; "false" otherwise., bool finished- Set to "true" when selection ends; "false" otherwise., Event originalEvent- The native DOM event (pointer, touch, or mouse) that triggered the selection change.
Changed	event GridChangedEventHandler	Fires whenever the selection within the Grid changes. During drag selection, this event is emitted both at the beginning of the drag operation and again when the selection is completed, allowing you to respond to both initiation and completion of drag-based selection changes.	GridChangedEventArgs
OnColumnClick	EventCallback<Event>	Triggered when the user clicks on a column header in a table or grid, typically to initiate actions such as sorting, filtering, or displaying additional options related to that column. This event provides context about which column was interacted with, allowing developers to implement responsive behaviors based on user actions.	dynamic column- The column configuration object of the clicked header., string dataField- The data field associated with the clicked column., dynamic originalEvent- The native DOM event (pointer, touch, or mouse) that triggered the click.
ColumnClicked	event GridColumnClickedEventHandler	Triggered when the user clicks on a column header in a table or grid, typically to initiate actions such as sorting, filtering, or displaying additional options related to that column. This event provides context about which column was interacted with, allowing developers to implement responsive behaviors based on user actions.	GridColumnClickedEventArgs
OnColumnDoubleClick	EventCallback<Event>	Fires when a user double-clicks on a column header, typically to initiate actions such as resizing, sorting, or customizing the corresponding column. The event provides information about the specific column that was interacted with, allowing you to implement custom logic in response to the double-click.	dynamic column- The column configuration object of the double-clicked header., string dataField- The data field associated with the double-clicked column., dynamic originalEvent- The native DOM event (pointer, touch, or mouse) that triggered the double-click.
ColumnDoubleClicked	event GridColumnDoubleClickedEventHandler	Fires when a user double-clicks on a column header, typically to initiate actions such as resizing, sorting, or customizing the corresponding column. The event provides information about the specific column that was interacted with, allowing you to implement custom logic in response to the double-click.	GridColumnDoubleClickedEventArgs
OnColumnResize	EventCallback<Event>	Triggered when the user adjusts the width of a column by dragging the boundary line in the column header. This event fires continuously as the header boundary is moved, allowing real-time updates to the column size.	dynamic column- The resized column's configuration object., string dataField- The data field associated with the resized column., string oldWidth- The previous width of the column., string width- The new width of the column after resizing.
ColumnResized	event GridColumnResizedEventHandler	Triggered when the user adjusts the width of a column by dragging the boundary line in the column header. This event fires continuously as the header boundary is moved, allowing real-time updates to the column size.	GridColumnResizedEventArgs
OnColumnDragStart	EventCallback<Event>	Fires when the user begins dragging a column to change its position within the column order. This event marks the start of a column reordering operation and can be used to implement visual feedback, custom logic, or to track changes in the column arrangement during a drag-and-drop interaction.	dynamic column- The configuration object of the column being dragged., string dataField- The data field associated with the column being dragged., int index- The index of the column within the grid., dynamic originalEvent- The native DOM event that initiated the column drag.
ColumnDragStarted	event GridColumnDragStartedEventHandler	Fires when the user begins dragging a column to change its position within the column order. This event marks the start of a column reordering operation and can be used to implement visual feedback, custom logic, or to track changes in the column arrangement during a drag-and-drop interaction.	GridColumnDragStartedEventArgs
OnColumnChange	EventCallback<Event>	Triggered whenever a property of a column is modified, either through user interaction (such as editing in the UI) or by programmatic changes made via code. This event allows you to respond to any updates in column properties, regardless of how the change was initiated.	dynamic column- The column whose property was changed., string propertyName- The name of the property that was changed., object oldValue- The previous value(s) of the changed property., object value- The new value(s) of the changed property.
ColumnChanged	event GridColumnChangedEventHandler	Triggered whenever a property of a column is modified, either through user interaction (such as editing in the UI) or by programmatic changes made via code. This event allows you to respond to any updates in column properties, regardless of how the change was initiated.	GridColumnChangedEventArgs
OnColumnDragging	EventCallback<Event>	This event is fired repeatedly for as long as the user is actively dragging a column. It provides real-time updates during the entire drag operation, allowing you to implement responsive behaviors or visual feedback as the column is being repositioned.	dynamic column- The column being dragged., string dataField- The data field of the dragged column., int index- The current index of the dragged column., dynamic data- An object providing drag feedback. Contains HTML elements 'feedback' and 'feedbackLine' shown during dragging, and methods 'error()', 'success()', and 'data()' for managing feedback state., dynamic originalEvent- The original browser event that triggered the dragging.
ColumnDragging	event GridColumnDraggingEventHandler	This event is fired repeatedly for as long as the user is actively dragging a column. It provides real-time updates during the entire drag operation, allowing you to implement responsive behaviors or visual feedback as the column is being repositioned.	GridColumnDraggingEventArgs
OnColumnDragEnd	EventCallback<Event>	Triggered when the user releases the mouse button to drop a column after dragging it, indicating the end of a column drag-and-drop operation. This event can be used to update the column order or perform actions based on the new column arrangement.	dynamic column- The column that was dragged., string dataField- The data field of the dragged column., int index- The original index of the column before dragging., int newIndex- The new index of the column after dragging., dynamic data- An object providing drag feedback. Contains HTML elements 'feedback' and 'feedbackLine' shown during dragging, and methods 'error()', 'success()', and 'data()' for managing feedback state., dynamic originalEvent- The original browser event that finalized the dragging.
ColumnDragEnded	event GridColumnDragEndedEventHandler	Triggered when the user releases the mouse button to drop a column after dragging it, indicating the end of a column drag-and-drop operation. This event can be used to update the column order or perform actions based on the new column arrangement.	GridColumnDragEndedEventArgs
OnColumnReorder	EventCallback<Event>	Fires when the user changes the order of columns by dragging and repositioning a column within the interface. This event occurs after the column has been successfully moved to its new position.	dynamic column- The reordered column., string dataField- The data field of the reordered column., int index- The column's previous index before reorder., int newIndex- The column's new index after reorder., dynamic data- An object providing drag feedback. Contains HTML elements 'feedback' and 'feedbackLine' shown during dragging, and methods 'error()', 'success()', and 'data()' for managing feedback state., dynamic originalEvent- The original browser event associated with the reorder.
ColumnReordered	event GridColumnReorderedEventHandler	Fires when the user changes the order of columns by dragging and repositioning a column within the interface. This event occurs after the column has been successfully moved to its new position.	GridColumnReorderedEventArgs
OnCommentAdd	EventCallback<Event>	Triggered when a user submits a new comment within the row edit dialog, typically as part of editing or updating a row's information. This event provides the context of the edited row and the content of the newly added comment, allowing for real-time updates or further processing.	string id- The unique ID of the row where the comment was added., object comment- The comment object containing: 'text' (string) - the comment text, 'id' (string) - unique comment ID, 'userId' (string | number) - ID of the user who added the comment, and 'time' (Date) - timestamp of the comment.
CommentAdded	event GridCommentAddedEventHandler	Triggered when a user submits a new comment within the row edit dialog, typically as part of editing or updating a row's information. This event provides the context of the edited row and the content of the newly added comment, allowing for real-time updates or further processing.	GridCommentAddedEventArgs
OnCommentRemove	EventCallback<Event>	Triggered when a user deletes or removes a comment while editing a row using the row edit dialog. This event occurs after the comment has been removed from the input field within the dialog, allowing you to handle any additional logic, such as updating the UI, saving changes, or notifying other components.	string id- The unique ID of the row from which the comment was removed., object comment- The comment object containing: 'text' (string) - the comment text, 'id' (string) - unique comment ID, 'userId' (string | number) - ID of the user who added the comment, and 'time' (Date) - timestamp of the comment.
CommentRemoved	event GridCommentRemovedEventHandler	Triggered when a user deletes or removes a comment while editing a row using the row edit dialog. This event occurs after the comment has been removed from the input field within the dialog, allowing you to handle any additional logic, such as updating the UI, saving changes, or notifying other components.	GridCommentRemovedEventArgs
OnContextMenuItemClick	EventCallback<Event>	Occurs when a user selects (clicks) an item from the context menu, typically accessed via right-click or long-press. This event enables developers to handle specific actions in response to the user's menu item selection.	string id- The unique ID of the row associated with the context menu item., string dataField- The data field of the clicked context menu item., dynamic command- The command object representing the action associated with the clicked menu item.
ContextMenuItemClicked	event GridContextMenuItemClickedEventHandler	Occurs when a user selects (clicks) an item from the context menu, typically accessed via right-click or long-press. This event enables developers to handle specific actions in response to the user's menu item selection.	GridContextMenuItemClickedEventArgs
OnRowDragStart	EventCallback<Event>	Triggered when the user begins dragging a table row, typically by clicking and holding on the row before moving it. This event signals the start of a drag-and-drop operation for reordering or repositioning rows within the table.	dynamic row- The row being dragged., string id- The unique ID of the row being dragged., int index- The index of the row within the grid., dynamic originalEvent- The original browser event that initiated the row drag.
RowDragStarted	event GridRowDragStartedEventHandler	Triggered when the user begins dragging a table row, typically by clicking and holding on the row before moving it. This event signals the start of a drag-and-drop operation for reordering or repositioning rows within the table.	GridRowDragStartedEventArgs
OnRowDragging	EventCallback<Event>	This event is triggered repeatedly in real-time as the user drags a row, firing continuously throughout the entire duration of the dragging action.	dynamic row- The row currently being dragged., string id- The unique ID of the dragged row., int index- The index of the row being dragged., dynamic data- An object providing drag feedback. Contains HTML elements 'feedback' and 'feedbackLine' shown during dragging, and methods 'error()', 'success()', and 'data()' for managing feedback state., dynamic originalEvent- The original browser event that triggered the dragging.
RowDragging	event GridRowDraggingEventHandler	This event is triggered repeatedly in real-time as the user drags a row, firing continuously throughout the entire duration of the dragging action.	GridRowDraggingEventArgs
OnRowDragEnd	EventCallback<Event>	This event is triggered upon completion of a row drag operation, regardless of whether the row’s position within the list was changed. It indicates the end of the drag interaction, and can be used to perform additional actions or cleanup tasks after users have finished dragging a row.	dynamic row- The dragged row object., string id- The unique identifier of the dragged row., int index- The original index of the row before dragging., int newIndex- The new index of the row after dragging., dynamic data- The dragging feedback object containing HTML elements displayed during the drag operation. Includes `feedback` and `feedbackLine` elements, and methods `error()`, `success()`, and `data()` to set or retrieve the drag state and data., dynamic originalEvent- The original pointer, touch, or mouse event that triggered the drag.
RowDragEnded	event GridRowDragEndedEventHandler	This event is triggered upon completion of a row drag operation, regardless of whether the row’s position within the list was changed. It indicates the end of the drag interaction, and can be used to perform additional actions or cleanup tasks after users have finished dragging a row.	GridRowDragEndedEventArgs
OnRowReorder	EventCallback<Event>	Triggered when a row has been successfully moved to a new position within the grid, indicating that the row reordering operation is complete and the grid's data order has been updated accordingly.	dynamic row- The reordered row object., string id- The unique identifier of the reordered row., int index- The original index of the row before reordering., int newIndex- The new index of the row after reordering., dynamic data- The dragging feedback object containing HTML elements displayed during the reorder operation. Includes `feedback` and `feedbackLine` elements, and methods `error()`, `success()`, and `data()` to set or retrieve the drag state and data., dynamic originalEvent- The original pointer, touch, or mouse event that triggered the reorder.
RowReordered	event GridRowReorderedEventHandler	Triggered when a row has been successfully moved to a new position within the grid, indicating that the row reordering operation is complete and the grid's data order has been updated accordingly.	GridRowReorderedEventArgs
OnRowExpand	EventCallback<Event>	This event is triggered when a user expands a row in either TreeGrid or Grouping mode, causing the hidden child rows or grouped data associated with that row to be displayed. It allows you to respond when hierarchical data or grouped content is revealed within the grid.	dynamic row- The expanded row object., string id- The unique identifier of the expanded row., dynamic originalEvent- The original pointer, touch, or mouse event that caused the expansion.
RowExpanded	event GridRowExpandedEventHandler	This event is triggered when a user expands a row in either TreeGrid or Grouping mode, causing the hidden child rows or grouped data associated with that row to be displayed. It allows you to respond when hierarchical data or grouped content is revealed within the grid.	GridRowExpandedEventArgs
OnRowCollapse	EventCallback<Event>	Triggered when a row is collapsed in TreeGrid or Grouping mode, causing any nested child rows or grouped content under that row to be hidden from view. This event allows you to respond when users collapse a parent row, such as updating UI elements or loading data dynamically.	dynamic row- The collapsed row object., string id- The unique identifier of the collapsed row., dynamic originalEvent- The original pointer, touch, or mouse event that caused the collapse.
RowCollapsed	event GridRowCollapsedEventHandler	Triggered when a row is collapsed in TreeGrid or Grouping mode, causing any nested child rows or grouped content under that row to be hidden from view. This event allows you to respond when users collapse a parent row, such as updating UI elements or loading data dynamically.	GridRowCollapsedEventArgs
OnRowClick	EventCallback<Event>	Triggered when a user clicks anywhere within a table row, allowing you to respond to row selection events, such as highlighting the row, displaying detailed information, or performing related actions.	dynamic row- The clicked row object., dynamic originalEvent- The original pointer, touch, or mouse event for the click., string id- The unique identifier of the clicked row., object data- The data object associated with the clicked row., bool isRightClick- Indicates whether the right mouse button was used for the click., int pageX- The X-coordinate of the click relative to the page., int pageY- The Y-coordinate of the click relative to the page.
RowClicked	event GridRowClickedEventHandler	Triggered when a user clicks anywhere within a table row, allowing you to respond to row selection events, such as highlighting the row, displaying detailed information, or performing related actions.	GridRowClickedEventArgs
OnRowDoubleClick	EventCallback<Event>	This event is triggered when a user rapidly double-clicks on any row within the data grid or table. It can be used to initiate actions such as opening a detailed view, activating edit mode, or performing custom operations related to the selected row. The event handler receives contextual information about the clicked row, allowing for targeted interactions.	dynamic row- The double-clicked row object., dynamic originalEvent- The original pointer, touch, or mouse event for the double-click., string id- The unique identifier of the double-clicked row., object data- The data object associated with the double-clicked row., bool isRightClick- Indicates whether the right mouse button was used for the double-click., int pageX- The X-coordinate of the double-click relative to the page., int pageY- The Y-coordinate of the double-click relative to the page.
RowDoubleClicked	event GridRowDoubleClickedEventHandler	This event is triggered when a user rapidly double-clicks on any row within the data grid or table. It can be used to initiate actions such as opening a detailed view, activating edit mode, or performing custom operations related to the selected row. The event handler receives contextual information about the clicked row, allowing for targeted interactions.	GridRowDoubleClickedEventArgs
OnRowResize	EventCallback<Event>	Triggered when the user manually adjusts the height of a table row, such as by dragging the row's resize handle. This event allows you to respond to row height changes, for example, by updating layout or saving the new row height.	dynamic row- The resized row object., string id- The unique identifier of the resized row., string oldHeight- The height of the row before resizing., string height- The new height of the row after resizing.
RowResized	event GridRowResizedEventHandler	Triggered when the user manually adjusts the height of a table row, such as by dragging the row's resize handle. This event allows you to respond to row height changes, for example, by updating layout or saving the new row height.	GridRowResizedEventArgs
OnRowStarred	EventCallback<Event>	Triggered when the user clicks the star icon located in a row header, toggling the starred (favorite) status of the corresponding row. This event allows you to handle actions such as marking or unmarking the row as a favorite in response to user interaction.	dynamic row- The row associated with the star toggle., dynamic originalEvent- The original pointer, touch, or mouse event for the star click., string id- The unique identifier of the starred row., bool value- Boolean indicating whether the row is now starred (`true`) or unstarred (`false`).
RowStarred	event GridRowStarredEventHandler	Triggered when the user clicks the star icon located in a row header, toggling the starred (favorite) status of the corresponding row. This event allows you to handle actions such as marking or unmarking the row as a favorite in response to user interaction.	GridRowStarredEventArgs
OnCellClick	EventCallback<Event>	Fires when a user clicks on any individual cell within the grid, providing information about the selected cell’s row, column, and associated data. This event enables you to implement custom actions in response to cell clicks, such as editing cell content, displaying detailed information, or triggering other interactive features.	dynamic cell- The clicked cell object., dynamic originalEvent- The original pointer, touch, or mouse event for the click., string id- The unique identifier of the row containing the clicked cell., string dataField- The data field (column identifier) of the clicked cell., object value- The value of the clicked cell., bool isRightClick- Indicates whether the right mouse button was used for the click., int pageX- The X-coordinate of the click relative to the page., int pageY- The Y-coordinate of the click relative to the page.
CellClicked	event GridCellClickedEventHandler	Fires when a user clicks on any individual cell within the grid, providing information about the selected cell’s row, column, and associated data. This event enables you to implement custom actions in response to cell clicks, such as editing cell content, displaying detailed information, or triggering other interactive features.	GridCellClickedEventArgs
OnCellDoubleClick	EventCallback<Event>	Fires when a user rapidly double-clicks on any cell within the grid, allowing you to handle actions such as entering edit mode, displaying detailed information, or executing custom logic specific to the selected cell.	dynamic cell- The double-clicked cell object., dynamic originalEvent- The original pointer, touch, or mouse event for the double-click., string id- The unique identifier of the row containing the double-clicked cell., string dataField- The data field (column identifier) of the double-clicked cell., object value- The value of the double-clicked cell., bool isRightClick- Indicates whether the right mouse button was used for the double-click., int pageX- The X-coordinate of the double-click relative to the page., int pageY- The Y-coordinate of the double-click relative to the page.
CellDoubleClicked	event GridCellDoubleClickedEventHandler	Fires when a user rapidly double-clicks on any cell within the grid, allowing you to handle actions such as entering edit mode, displaying detailed information, or executing custom logic specific to the selected cell.	GridCellDoubleClickedEventArgs
OnEndEdit	EventCallback<Event>	Triggered when a user completes editing a cell or an entire row. This event supplies comprehensive information about the edit operation, including the updated values, the specific cells or rows affected, and any changes made by the user. It enables developers to capture and respond to user edits with detailed context.	string id- The unique identifier of the row that was edited. This helps to locate the specific row within the grid., string dataField- The data field key (column identifier) of the cell that was edited., dynamic row- The full row object that contains the edited cell, representing the row's current state after editing., dynamic column- The column object corresponding to the edited cell, including its metadata and configuration., dynamic cell- The specific cell object that was edited, providing granular access to the edited cell's properties., object data- An object representing the entire data record of the edited row, reflecting all current values post-edit., object value- The new value entered by the user in the edited cell.
EndEdited	event GridEndEditedEventHandler	Triggered when a user completes editing a cell or an entire row. This event supplies comprehensive information about the edit operation, including the updated values, the specific cells or rows affected, and any changes made by the user. It enables developers to capture and respond to user edits with detailed context.	GridEndEditedEventArgs
OnFilter	EventCallback<Event>	This event is triggered whenever filters within the grid are added, updated, or removed. It allows developers to monitor and respond to any changes in the grid’s filtering criteria. By handling this event, you can implement custom logic—such as updating UI elements, fetching new data, or logging filter modifications—whenever the user changes how data is filtered in the grid.	dynamic columns- An array of column objects currently involved in filtering, providing access to each filtered column’s properties., Array<{dataField: string, filter: object}> data- An array of objects each containing a column’s data field and its associated FilterGroup object. The FilterGroup describes the filter conditions applied to that column. Example: { dataField: string, filter: object }., Array<{dataField: string, filter: string}> expressions- An array of filter expression objects, each with a column’s data field and a human-readable filter expression string. These expressions define the applied filters, e.g., 'startsWith B' or complex logical expressions like 'contains Andrew or contains Nancy'. Supported operators include '=', 'EQUAL', '<>', 'NOT_EQUAL', '!=', '<', 'LESS_THAN', '>', 'GREATER_THAN', '<=', 'LESS_THAN_OR_EQUAL', '>=', 'GREATER_THAN_OR_EQUAL', 'starts with', 'STARTS_WITH', 'ends with', 'ENDS_WITH', 'EMPTY', 'CONTAINS', 'DOES_NOT_CONTAIN', 'NULL', and 'NOT_NULL'.
Filtered	event GridFilteredEventHandler	This event is triggered whenever filters within the grid are added, updated, or removed. It allows developers to monitor and respond to any changes in the grid’s filtering criteria. By handling this event, you can implement custom logic—such as updating UI elements, fetching new data, or logging filter modifications—whenever the user changes how data is filtered in the grid.	GridFilteredEventArgs
OnGroup	EventCallback<Event>	Triggered whenever the grid's grouping configuration is modified—for example, when columns are added to or removed from the grouped columns. This event allows you to respond to user actions that change how data is grouped in the grid.	string[] groups- An array of data fields that represent the columns currently used for grouping the grid’s rows. The order of fields reflects the grouping hierarchy.
Grouped	event GridGroupedEventHandler	Triggered whenever the grid's grouping configuration is modified—for example, when columns are added to or removed from the grouped columns. This event allows you to respond to user actions that change how data is grouped in the grid.	GridGroupedEventArgs
OnOpenColumnDialog	EventCallback<Event>	Emitted whenever the dialog interface for adding a new column or editing an existing column is displayed to the user. This event is ideal for implementing custom logic, such as pre-filling form fields, dynamically modifying dialog content, or applying additional UI enhancements when the column dialog becomes visible.	string dataField- The data field of the column currently being added or edited via the dialog.
OpenColumnDialoged	event GridOpenColumnDialogedEventHandler	Emitted whenever the dialog interface for adding a new column or editing an existing column is displayed to the user. This event is ideal for implementing custom logic, such as pre-filling form fields, dynamically modifying dialog content, or applying additional UI enhancements when the column dialog becomes visible.	GridOpenColumnDialogedEventArgs
OnCloseColumnDialog	EventCallback<Event>	Fires when the column addition or editing dialog is closed, regardless of whether the user saves their changes or cancels the operation. This event allows developers to perform actions after the dialog is dismissed, such as updating the UI or resetting form states.	string dataField- The data field of the column involved in the dialog that was just closed.
CloseColumnDialoged	event GridCloseColumnDialogedEventHandler	Fires when the column addition or editing dialog is closed, regardless of whether the user saves their changes or cancels the operation. This event allows developers to perform actions after the dialog is dismissed, such as updating the UI or resetting form states.	GridCloseColumnDialogedEventArgs
OnRowTap	EventCallback<Event>	Triggered when a user performs a press-and-hold gesture on a grid row, maintaining contact for at least 300 milliseconds. This event is commonly used to open context menus or initiate specialized touch-based interactions, enhancing the user experience on touch-enabled devices.	dynamic row- The row object that was tapped and held., Event originalEvent- The original input event object ('pointer', 'touch', or 'mouse'), which provides device-specific details.
RowTaped	event GridRowTapedEventHandler	Triggered when a user performs a press-and-hold gesture on a grid row, maintaining contact for at least 300 milliseconds. This event is commonly used to open context menus or initiate specialized touch-based interactions, enhancing the user experience on touch-enabled devices.	GridRowTapedEventArgs
OnCellTap	EventCallback<Event>	Triggered when a user performs a press-and-hold gesture—touching and continuously holding a specific cell in the grid for at least 300 milliseconds. This event enables advanced touch interactions, such as displaying context menus, initiating drag-and-drop, or activating additional cell options. It is designed to distinguish intentional long presses from casual taps, ensuring a responsive and intuitive touch interface.	dynamic cell- The cell object that was tapped and held., Event originalEvent- The original input event object ('pointer', 'touch', or 'mouse') providing context about the interaction.
CellTaped	event GridCellTapedEventHandler	Triggered when a user performs a press-and-hold gesture—touching and continuously holding a specific cell in the grid for at least 300 milliseconds. This event enables advanced touch interactions, such as displaying context menus, initiating drag-and-drop, or activating additional cell options. It is designed to distinguish intentional long presses from casual taps, ensuring a responsive and intuitive touch interface.	GridCellTapedEventArgs
OnPage	EventCallback<Event>	Triggered whenever the user switches pages using the grid’s pagination controls. This event allows you to detect and respond to page changes, such as updating data, fetching new records, or performing additional actions whenever a different page is selected.	N/A
Paged	event GridPagedEventHandler	Triggered whenever the user switches pages using the grid’s pagination controls. This event allows you to detect and respond to page changes, such as updating data, fetching new records, or performing additional actions whenever a different page is selected.	GridPagedEventArgs
OnSort	EventCallback<Event>	Triggered whenever columns are added to, removed from, or reordered within the grid’s sorting configuration. This event enables developers to monitor changes in the sorting criteria, update the sorting state, and track the current sort order and priority of columns in the grid.	dynamic columns- An array of column objects currently sorted, including their configurations and properties., Array<{dataField: string, sortOrder: string, sortIndex: number}> data- An array of objects describing each sorted column with its data field, sorting order ('asc' or 'desc'), and priority index indicating sorting precedence in multi-column sorts., string[] sortDataFields- An array of the data fields of all currently sorted columns., string[] sortDataTypes- An array of data types ('string', 'date', 'boolean', or 'number') corresponding to the sorted columns., string[] sortOrders- An array of sorting directions ('asc' or 'desc') applied to the sorted columns., number[] sortIndexes- An array of integers representing the sorting priority for each column in cases of multi-column sorting, where lower index means higher priority.
Sorted	event GridSortedEventHandler	Triggered whenever columns are added to, removed from, or reordered within the grid’s sorting configuration. This event enables developers to monitor changes in the sorting criteria, update the sorting state, and track the current sort order and priority of columns in the grid.	GridSortedEventArgs
OnScrollBottomReached	EventCallback<Event>	Triggered when the user scrolls to the absolute bottom of the grid component. This event is typically used to implement infinite scrolling or lazy loading by allowing you to detect when additional data needs to be loaded as the user reaches the end of the currently displayed content.	N/A
ScrollBottomReached	event GridScrollBottomReachedEventHandler	Triggered when the user scrolls to the absolute bottom of the grid component. This event is typically used to implement infinite scrolling or lazy loading by allowing you to detect when additional data needs to be loaded as the user reaches the end of the currently displayed content.	GridScrollBottomReachedEventArgs
OnScrollTopReached	EventCallback<Event>	Triggered when the user scrolls to the very top edge of the grid. This event allows you to perform actions such as refreshing the grid's contents, loading previous or additional data, or updating UI elements in response to the scroll position. Use this event to enhance data loading and user experience when users reach the beginning of the grid.	N/A
ScrollTopReached	event GridScrollTopReachedEventHandler	Triggered when the user scrolls to the very top edge of the grid. This event allows you to perform actions such as refreshing the grid's contents, loading previous or additional data, or updating UI elements in response to the scroll position. Use this event to enhance data loading and user experience when users reach the beginning of the grid.	GridScrollTopReachedEventArgs

Enums

GridAppearanceAutoGenerateRowLabelMode

GridAppearanceAutoGenerateRowLabelMode.Number

GridAppearanceAutoGenerateRowLabelMode.Letter

GridAppearanceAutoGenerateColumnLabelMode

GridAppearanceAutoGenerateColumnLabelMode.Number

GridAppearanceAutoGenerateColumnLabelMode.Letter

GridResizeMode

GridResizeMode.None

GridResizeMode.Split

GridResizeMode.GrowAndShrink

GridClipboardAutoFillMode

GridClipboardAutoFillMode.None

GridClipboardAutoFillMode.Copy

GridClipboardAutoFillMode.FillSeries

HorizontalAlignment

HorizontalAlignment.Left

HorizontalAlignment.Center

HorizontalAlignment.Right

VerticalAlignment

VerticalAlignment.Top

VerticalAlignment.Center

VerticalAlignment.Bottom

GridColumnFilterMenuMode

GridColumnFilterMenuMode.Basic

GridColumnFilterMenuMode.Default

GridColumnFilterMenuMode.Excel

GridColumnSortOrder

GridColumnSortOrder.Asc

GridColumnSortOrder.Desc

GridColumnSortOrder.None

GridConditionalFormattingCondition

GridConditionalFormattingCondition.Between

GridConditionalFormattingCondition.Equal

GridConditionalFormattingCondition.GreaterThan

GridConditionalFormattingCondition.LessThan

GridConditionalFormattingCondition.NotEqual

GridDataExportPageOrientation

GridDataExportPageOrientation.Landscape

GridDataExportPageOrientation.Portrait

GridDataSourceSettingsSanitizeHTML

GridDataSourceSettingsSanitizeHTML.All

GridDataSourceSettingsSanitizeHTML.BlackList

GridDataSourceSettingsSanitizeHTML.None

GridDataSourceSettingsDataFieldDataType

GridDataSourceSettingsDataFieldDataType.String

GridDataSourceSettingsDataFieldDataType.Date

GridDataSourceSettingsDataFieldDataType.Boolean

GridDataSourceSettingsDataFieldDataType.Number

GridDataSourceSettingsDataFieldDataType.Array

GridDataSourceSettingsDataFieldDataType.Any

GridDataSourceSettingsDataSourceType

GridDataSourceSettingsDataSourceType.Array

GridDataSourceSettingsDataSourceType.Json

GridDataSourceSettingsDataSourceType.Xml

GridDataSourceSettingsDataSourceType.Csv

GridDataSourceSettingsDataSourceType.Tsv

GridEditingAction

GridEditingAction.None

GridEditingAction.Click

GridEditingAction.DoubleClick

LayoutPosition

LayoutPosition.Near

LayoutPosition.Far

LayoutPosition.Both

GridCommandDisplayMode

GridCommandDisplayMode.Label

GridCommandDisplayMode.Icon

GridCommandDisplayMode.LabelAndIcon

Position

Position.Near

Position.Far

GridEditingMode

GridEditingMode.Cell

GridEditingMode.Row

GridEditingAddNewRowDisplayMode

GridEditingAddNewRowDisplayMode.Row

GridEditingAddNewRowDisplayMode.Button

GridFilteringFilterRowApplyMode

GridFilteringFilterRowApplyMode.Auto

GridFilteringFilterRowApplyMode.Click

GridFilteringFilterMenuMode

GridFilteringFilterMenuMode.Default

GridFilteringFilterMenuMode.Excel

GridGroupingExpandMode

GridGroupingExpandMode.ButtonClick

GridGroupingExpandMode.RowClick

GridGroupingRenderMode

GridGroupingRenderMode.Basic

GridGroupingRenderMode.Compact

GridGroupingRenderMode.Advanced

GridGroupingRenderMode.MultipleColumns

GridHeaderSearchCommand

GridHeaderSearchCommand.Search

GridHeaderSearchCommand.Filter

GridPagerAutoEllipsis

GridPagerAutoEllipsis.None

GridPagerAutoEllipsis.Before

GridPagerAutoEllipsis.After

GridPagerAutoEllipsis.Both

Scrolling

Scrolling.Physical

Scrolling.Virtual

Scrolling.Infinite

Scrolling.Deferred

GridSelectionMode

GridSelectionMode.One

GridSelectionMode.Many

GridSelectionMode.Extended

GridSelectionAction

GridSelectionAction.None

GridSelectionAction.Click

GridSelectionAction.DoubleClick

GridSelectionCheckBoxesSelectAllMode

GridSelectionCheckBoxesSelectAllMode.None

GridSelectionCheckBoxesSelectAllMode.Page

GridSelectionCheckBoxesSelectAllMode.All

GridSortingMode

GridSortingMode.One

GridSortingMode.Many

GridSortingCommandKey

GridSortingCommandKey.Default

GridSortingCommandKey.Alt

GridSortingCommandKey.Control

GridSortingCommandKey.Shift

Column Properties

Name	Type	Default	Description
Align	HorizontalAlignment	HorizontalAlignment.Left	Sets or gets the column's header alignment. Accepts: HorizontalAlignment.Left, HorizontalAlignment.Center, HorizontalAlignment.Right
AllowExport	bool	true	Sets or gets whether the column can be exported.
AllowGroup	bool	true	Sets or gets whether the column can be grouped.
AllowHide	bool	true	Sets or gets whether the column can be hidden.
AllowSelect	bool	true	Sets or gets whether the column can be selected.
AllowEdit	object	true	Sets or gets whether the column can be edited. The property can be 'boolean' i.e accept true and false values. To dynamically determine which cells are editable, a callback function can be supplied to the 'allowEdit' property. For example: allowEdit: (id, dataField, value, data) => { return value === 'Cappuccino'; }
AllowSort	bool	true	Sets or gets whether the column can be sorted.
AllowHeaderEdit	bool	true	Sets or gets whether the column can be edited, when header editing is enabled.
AllowFilter	bool	true	Sets or gets whether the column can be filtered.
AllowReorder	bool	true	Sets or gets whether the column can be reordered.
AllowResize	bool	true	Sets or gets whether the column can be resized.
AllowNull	bool	true	Sets or gets whether the column can have 'null' values.
CardHeight	int	0	Sets or gets the cell's height in card view mode.
CellsFormat	string	""	Defines the format applied to the column's cell values. Supports number and date format strings. Examples for numeric formatting: 'd' - Decimal numbers (e.g., 25) 'f' - Floating-point numbers (e.g., 25.50) 'n' - Integer numbers with thousands separator (e.g., 1,000) 'c' - Currency format (e.g., $25.50) 'p' - Percentage format (e.g., 50%) To define decimal places, append a number (e.g., 'c2' = $25.26). Examples for date formatting: 'd' - Short date (e.g., 3/25/2025) 'D' - Long date (e.g., Tuesday, March 25, 2025) 't' - Short time (e.g., 1:30 PM) 'T' - Long time (e.g., 1:30:45 PM) 'f' - Long date + short time 'F' - Long date + long time 'M' - Month/day (e.g., March 25) 'Y' - Year and month (e.g., 2025 March) 'S' - Sortable, culture-invariant format (e.g., 2025-03-25T13:30:45) Custom date format tokens: 'dd' - Day of month (e.g., 01-31) 'MMMM' - Full month name 'yyyy' - 4-digit year And many more standard date/time tokens
CellsAlign	HorizontalAlignment	HorizontalAlignment.Left	Controls the horizontal alignment of cell content. Acceptable values: 'left' - Aligns content to the left 'right' - Aligns content to the right 'center' - Centers content horizontally
CellsWrap	bool	false	Sets or gets the column's cells wrapping. Accepts: true or false.
CellsVerticalAlign	VerticalAlignment	VerticalAlignment.Center	Sets or gets the column's cells vertical alignment. Accepts: VerticalAlignment.Top, VerticalAlignment.Center, VerticalAlignment.Bottom
ClassName	string	""	Sets or gets the column's header CSS class name. You can apply multiple CSS class names by separating them with space.
CellsClassName	object	""	Sets or gets the column's cells CSS class name(s). The property can be used with string and function. You can apply multiple CSS class names by separating them with space or you can return a CSS class name(s) when you use it as a function. The function gets called with the following parameters: index - row's index, dataField - column's data field, cellValue - current cell's value, rowData - current row's data, row - GridRow object. Ex: cellsClassName: (index, dataField, value, rowData, row) => { if (index === 0) { return 'cell-class-1' } }
CellsCSSRules	object	null	Sets or gets the column's cells CSS class rules. Different CSS class names are conditionally applied. Example: label: 'Quantity', dataField: 'quantity', editor: 'numberInput', cellsClassRules: { 'one': settings => settings.value > 5, 'two': settings => settings.value <5, 'three': settings => settings.value === 3 }. The settings object contains the following properties: index, value, dataField, row, api.
CellsRenderer	Func<object, string, object, object, object, string>	null	Sets or gets the column's cells renderer function for custom html rendering in the cells. For more advanced scenarios use formatFunction or template, but for simple html rendering, you can use this.
ColumnGroup	string	""	Sets the name of the column group.
DataField	string	""	Sets or gets the column's data source bound field.
DataType	string	"string"	Sets or gets the column's data type. Any of the following value is valid: 'string', 'number', 'int', 'date', 'bool', 'object', 'any'
DisplayField	string	""	Sets or gets the column's data source bound field which will be displayed to the user. When the property is not set, it is equal to the 'dataField'.
Description	string	""	Sets or gets the column's description. The description of the column is displayed in the column's header, when the end-user moves the pointer over the description button. 'showDescriptionButton' property determines whether the description button is visible.
DataSet	object	null	Sets or gets custom data object related to the column.
Element	object	null	Gets the HTML Element. The property returns null when the Column is not in the View.
Editor	object	null	Sets or gets the column's editor. The property expects 'input', 'autoComplete', 'comboBox', 'dropDownList', 'image', 'numberInput', 'checkBox', 'multiInput', 'multiComboInput', 'checkInput', 'slider', 'dateTimePicker', 'timeInput', 'dateInput', 'dateRangeInput', 'maskedTextBox', 'textArea' or a custom object with 'template' property which defines the editor type, 'settings' property which defines the custom editor's properties, 'onInit(int row, string column, object editor, object rowData): void', 'onRender(int row, string column, object editor, object rowData): void', 'setValue(object value): void' and 'getValue(object value): any' callback functions.
Freeze	string	"false"	Sets or gets the Freeze mode. Accepts: 'near', 'far', true and false. Freezes/Pins the column to left(near) or right(far).
Filter	string	""	Sets or gets the filter of the column. Example: ['contains Andrew or contains Nancy']. Example with numeric filter ['quantity', '<= 3 and >= 8']. Additional example with filter which we want to apply to a column with filterMenuMode='excel' - ['EQUAL' 'Andrew' or 'EQUAL' 'Antoni' or 'EQUAL' 'Beate']. Example with a string filter applied to a string column - ['CONTAINS' 'burke' or 'CONTAINS' 'peterson']. Filter conditions which you can use in the expressions: '=', 'EQUAL','<>', 'NOT_EQUAL', '!=', '<', 'LESS_THAN','>', 'GREATER_THAN', '<=', 'LESS_THAN_OR_EQUAL', '>=', 'GREATER_THAN_OR_EQUAL','starts with', 'STARTS_WITH','ends with', 'ENDS_WITH', '', 'EMPTY', 'CONTAINS','DOES_NOT_CONTAIN', 'NULL','NOT_NULL'
FilterMenuMode	GridColumnFilterMenuMode	GridColumnFilterMenuMode.Default	Sets or gets the filter menu mode of the column. In 'basic' mode, a single input is displayed in the filter menu. In 'default' mode, two input options are available for more precise filtering. In 'excel' mode, checked list with unique values is displayed.
FilterEditor	object	null	Sets or gets the column's filter editor. The value is an object with the following possible options: template: string, condition: string, onInit: any - callback function for init purposes, min: number, max: number, minLength: number, maxLength: number
FormatSettings	object	new object()	Defines the formatting settings applied to the column's values. You can use built-in formatting options or provide advanced internationalization formats using Intl objects. For example, to apply currency formatting: 'Intl: { NumberFormat: { style: "currency", currency: "EUR" } }', or for date formatting: 'Intl: { DateTimeFormat: { dateStyle: "full" } }'.
Formula	string	""	Sets or gets the column's formula. The formula you set will be applied to all cells. Example: COL(Name) & '-' & COL(Price) or IF(COL(Price) * COL(Quantity) > 5, 'Yes', 'No')
Group	string	""	Sets or gets the column's group.
GetCellValue	object	null	This function allows you to provide custom cell values, which will be displayed in the column's cells. The grid passes 3 arguments to the function - row id, column's dataField and row's data.
GetFilterPanel	object	null	Gets the column's filter panel. The function should return HTMLElement which will represent the filter UI panel displayed in the filter menu. The function works in combination with updateFilterPanel
Icon	string	""	Sets or gets the column's icon. Expects CSS class name.
Label	string	""	Sets or gets the text displayed in the column's header.
LabelTemplate	object	""	Sets or gets the column header's template. The property expects the 'id' of HTMLTemplateElement, HTML string or function which returns html string.
MinWidth	int	30	Sets or gets the minimum width.
RowSpan	int	-1	Sets or gets the column's rowSpan function. Allows you to dynamically span cells.
RelationId	string	""	Defines the unique identifier of a relation within dataSourceSettings.relations. Must be used together with the 'relationField' property to establish the relationship mapping.
RelationField	string	""	Specifies the data field within the current data source that participates in the relationship defined by 'relationId'. Both 'relationField' and 'relationId' must be configured to create a valid relation.
Options	IEnumerable<object>	new List<object>()	Sets or gets the column options for editors such as list, dropdownlist or tags.
SortOrder	GridColumnSortOrder	GridColumnSortOrder.None	Sets or gets the sort order of the column. Accepts: 'asc', 'desc', 'none' and null.
SortIndex	int	-1	Sets or gets the sort index of the column. Accepts an integer value. This property can be used to get or set the column's sort index when sorting mode is 'many'.
SortComparator	object	null	Sets or gets a custom 'sortComparator' function. It can be used for implementing custom sorting. Ex: sortComparator: (value1, value2) => { if (value1 === value2) return 0; return value1 <value2; }
ShowActionButton	bool	true	Sets or gets whether the column's header action drop-down button is displayed. This button opens the column's menu.
ShowIcon	bool	false	Sets or gets whether the column's header icon is displayed.
ShowDescriptionButton	bool	false	Sets or gets whether the column's header description button is displayed.
Width	object	""	Sets or gets the width. Accepts: 'number', 'px', 'em', 'auto', 'null' values.
Template	object	""	Sets or gets the column's template. The property expects the 'id' of HTMLTemplateElement or HTML string which is displayed in the cells. Built-in string values are: 'checkBox', 'switchButton', 'url', 'email', 'dropdownlist', 'list', 'progress', 'tags', 'autoNumber', 'modifiedBy', 'createdBy', 'createdTime', 'modifiedTime', 'images', 'checklist', 'attachments', 'sparklines', 'richText', 'color', 'rating', 'duration', 'startDate', 'dueDates'. For example, when you set the template to 'url', the cells will be render anchor tags. When you set the template property to HTMLTemplateElement you should consider that once a template is rendered, the formatObject.template property stores the rendered template component for further use.
TemplateSettings	object	null	Sets or gets additional settings related to the column's template. For example, when the template is 'sparklines', the templateSettings could be an object which defines has 'type' - 'bar', 'column', 'line' or 'pie'. If you want to apply a custom color, you can add the 'colorFunction: function(value) { } and return a custom color as a 'hex' string or a 'tooltipFormatFunction: function(value) {}' which returns a formatted tooltip string. Additional properties are 'min', 'max', 'gap' and 'strokeWidth'.
ValidationRules	IEnumerable<object>	null	Sets or gets the column's validation rules. The expected value is an Array of Objects. Each object should have a 'type' property that can be set to 'required', 'min', 'max', 'minLength', 'maxLength', 'email', 'null', 'requiredTrue', 'minData', 'maxDate', 'pattern'. The 'value' property should be set, too. For validation rule types 'required', 'requiredTrue' and 'null' you can skip the 'value' property. Optional property is 'message', which determines the error message.
VerticalAlign	VerticalAlignment	VerticalAlignment.Center	Sets or gets the column's header vertical alignment. Accepts: VerticalAlignment.Top, VerticalAlignment.Center, VerticalAlignment.Bottom
Summary	string[]	new string[]{}	Sets or gets the column summary. The property should be set to an array with the following possible values: 'sum', 'min', 'max', 'avg', 'count', 'median', 'stdev', 'stdevp', 'var', 'varp'.
UpdateFilterPanel	object	null	Updates the column's filter panel. The function works in combination with getFilterPanel
Visible	bool	true	Sets or gets whether the column is visible. Set the property to 'false' to hide the column.

GridAppearance Properties

Name	Type	Default	Description
AlternationStart	int	0	Specifies the row index from which the alternating color pattern should begin. This determines the first row in the sequence that will receive a different background color, enabling alternating row colors for improved readability.
AlternationEnd	int	0	Indicates the ending row index at which the alternating color pattern stops being applied. This index is inclusive, meaning the alternating colors will be applied up to and including this row.
AlternationCount	int	0	The total number of times the row background color alternates, creating a striped (zebra) pattern in the table. Each alternation changes the row color from one specified color to the next in the sequence.
AllowColumnStickyPosition	bool	false	Allows specific table columns to remain fixed (sticky) on the left or right side while horizontally scrolling, improving table readability and user experience.
AllowHover	bool	false	Activates a hover effect for table rows. When a user hovers over a row, a distinct style is applied to all cells within that row, improving interactivity and highlighting the row under the cursor.
AllowHeaderHover	bool	true	Activates a visual hover effect on header elements. When a user moves their cursor over a header, a distinct hover style is applied to highlight the header and improve interactivity.
AllowRowToggleAnimation	bool	false	Enables animated transitions when expanding or collapsing a row in TreeGrid or Grouping mode. When this option is active, rows smoothly slide open or closed, enhancing the user experience by visually indicating the change in row state. This animation is triggered each time a row is expanded to show child nodes or collapsed to hide them.
AllowRowDetailToggleAnimation	bool	false	Enables animated transitions when expanding or collapsing row details in TreeGrid or Grouping mode. When a user clicks to expand or collapse a row, a smooth animation visualizes the row’s content appearing or disappearing, enhancing the user experience by clearly indicating the change in row state.
AllowSortAnimation	bool	false	Enables animated sorting of data records. When sorting is applied, the data records are visually rearranged using smooth transition animations, providing a clear and engaging user experience as the records update their order on the interface.
AllowColumnLabelAnimation	bool	true	Activates animation for the column label. When a user hovers over the column header or applies sorting—causing the header’s drop-down button to appear—the column label smoothly transitions to the left using an animation effect. This improves the visual feedback and highlights the interactive state of the column header.
AllowColumnMenuAnimation	bool	true	Controls whether the column menu displays with an animated transition. When enabled, clicking the drop-down button on a column header will show or hide the menu using a smooth animation effect, enhancing the user experience. If disabled, the menu will appear and disappear instantly without animation.
AllowColumnSortButtonAnimation	bool	true	Enables animated transitions for column sort buttons. When a user clicks on a sortable column header to change the sort order (ascending or descending), the sort button visually animates to indicate the sorting action, enhancing user feedback and interface interactivity.
AllowColumnActionButtonAnimation	bool	true	Enables animation for the column action button. When this option is active, the drop-down button that appears upon hovering over a column header will display with a smooth animation effect, enhancing visual feedback for the user. If disabled, the drop-down button will appear instantly without any animation.
AllowColumnFilterButtonAnimation	bool	true	Activates animated transitions for column filter buttons, providing visual feedback when filters are applied or removed. This enhances user experience by making the filtering process more intuitive and visually engaging.
AutoShowColumnSortButton	bool	true	When enabled, this property automatically displays the column sort button only when the column is actively sorted. If set to false, the sort button is always visible, regardless of whether the column is currently sorted, indicating that sorting is available for that column.
AutoShowColumnActionButton	bool	true	If enabled, this option automatically displays the column action button, allowing users to access additional actions or settings related to the column without manual configuration.
AutoShowColumnFilterButton	bool	true	If enabled, this option automatically displays a filter button in each column header, allowing users to quickly access and apply filtering options to the column's data.
AutoGenerateRowLabelMode	GridAppearanceAutoGenerateRowLabelMode	GridAppearanceAutoGenerateRowLabelMode.Number	Specifies the format of row header labels, allowing you to choose between sequential numbers (e.g., 1, 2, 3, ...) or alphabetical letters (e.g., A, B, C, ...). Changing this property determines how the row headers are displayed in the rendered output.
AutoGenerateColumnLabelMode	GridAppearanceAutoGenerateColumnLabelMode	GridAppearanceAutoGenerateColumnLabelMode.Letter	Determines the format of the column header labels, allowing them to be displayed as either sequential numbers (e.g., 1, 2, 3…) or letters (e.g., A, B, C…). This property directly influences how column headers are rendered and displayed in the table interface.
DisplayLoadingIndicator	bool	false	Controls the visibility of the loading indicator in the Grid component. When enabled, a "Loading..." image or animation is displayed as an overlay while the Grid is fetching or processing data, providing visual feedback to users that content is being loaded.
LoadingIndicatorPlaceholder	string	"Loading..."	Specifies the label text shown in the loading indicator. This text appears to inform users that data is currently being loaded or processed. Use this property to customize the loading message for better user experience.
Placeholder	string	"No Rows"	Specifies the placeholder content displayed in the Grid when there are no data items to show. This placeholder provides a visual cue or message to users, indicating that the Grid is currently empty.
SortAnimationDuration	int	500	Specifies the length of time, in milliseconds, that the sorting animation will run when items are sorted. This property takes effect only if the allowSortAnimation property is enabled. Use it to control the speed and smoothness of the sorting transition for a better user experience.
ShowRowHeader	bool	false	Toggles the visibility of the row header, allowing you to either display or hide the header section for each row in the grid or table.
ShowTreeRowHeader	bool	false	Controls the visibility of row headers within the TreeGrid component. By default, non-leaf tree items (i.e., parent nodes) are rendered as standard rows. When this property is set to true, these parent nodes are displayed as row headers, visually distinguished in a manner similar to how group headers are rendered. This enhances the hierarchical structure of the TreeGrid, making parent-child relationships more prominent.
ShowRowHeaderNumber	bool	false	Displays the row indexes in the row header section of the table. To enable this feature, set the showRowHeader property to true. When activated, each row header will display its corresponding index, providing clear reference points for users.
ShowRowHeaderEditIcon	bool	true	Displays an edit icon whenever a cell or row enters the edit state, providing a clear visual indicator that the item is currently being modified.
ShowRowHeaderSelectIcon	bool	false	Displays a selection icon when the user's pointer hovers over the row header cell, providing a visual cue that the row can be selected.
ShowRowHeaderFocusIcon	bool	false	Displays a focus icon whenever a table cell or entire row is focused, providing a clear visual indicator of the current selection for improved accessibility and user interaction.
ShowRowHeaderDragIcon	bool	false	Displays a drag handle icon within the row header, allowing users to initiate and perform row drag-and-drop actions for reordering rows.
ShowColumnHeaderLines	bool	true	Displays visible lines that separate the headers of columns from one another, making it easier to distinguish between different column headings in a table or grid layout.
ShowColumnHeaderDragIcon	bool	false	Displays a drag handle icon on the column header when drag-and-drop functionality is enabled. The icon becomes visible when the user hovers the mouse cursor near the left edge of the column header, indicating that the column can be dragged to a new position.
ShowColumnLines	bool	true	Displays vertical grid lines between columns, making it easier to distinguish and separate individual columns within the layout.
ShowRowLines	bool	true	Displays horizontal lines that separate each row in the table, making it easier to distinguish and read individual rows.
ShowColumnGroupLines	bool	true	Displays vertical divider lines between columns that are organized into groups, visually separating each column within the group to improve readability and distinction.
ShowColumnGroupCellLines	bool	true	Displays dividing lines between cells within column groups, clearly separating each cell to improve readability and organization within grouped columns.
ShowColumnGroupsInColumnPanel	bool	false	Displays column groups in the "Hide columns" panel, presenting both column groups and individual columns in a hierarchical, tree-like structure. If this property is set to false, column groups are hidden from the panel, and instead, column labels are prefixed with their corresponding group name for context.
ShowFilterColumnBackground	bool	false	Displays a distinct background color on the column header to indicate when a filter has been applied to that column. This visually highlights filtered columns, helping users easily identify which columns are currently filtered.
ShowSortColumnBackground	bool	false	Highlights the background of the column currently being sorted, visually indicating which column has an active sort applied.
ShowFrozenColumnBackground	bool	true	Displays a distinct background for frozen columns in the grid, making it visually clear which columns are fixed in place when horizontal scrolling is enabled. This feature is active only when the grid contains frozen columns.
ShowSelectionOnTop	bool	false	Displays the selection with the highest visual priority, ensuring it appears above all other styled elements. This guarantees the selection remains clearly visible and is not obscured by any other interface elements or styles.
ShowColumnSortButton	bool	true	Displays a sorting button within the column header, allowing users to sort the column's data in ascending or descending order.
ShowColumnFilterButton	bool	true	Displays a filter button in the column header, allowing users to access filtering options for that specific column.
ShowColumnDescriptionButton	bool	false	Displays a button that reveals the column description. The appearance and styling of this button can be fully customized using the Grid's CSS classes, allowing you to match it to your application's design.
ShowColumnIcon	bool	false	Displays an icon within the header of the column, providing a visual indicator or representation specific to that column. This icon appears alongside or instead of the column title and can be used to convey additional information or functionality related to the column's contents.
ShowColumnCustomButton	bool	false	Displays a user-defined custom button in the column header. This allows developers to add their own button to the top of a column, enabling custom actions or functionality specific to that column.
ShowColumnActionButton	bool	true	Displays the column action button, which appears as a drop-down menu icon within the column header. This button allows users to access additional actions or settings related to the specific column, such as sorting, filtering, or customizing the column display.
ShowTooltips	bool	false	Displays informative tooltips when the user hovers over table columns or individual cells, providing additional context or details about the data shown.
ShowHorizontalScrollBarOnFixedColumns	bool	false	Displays a horizontal scrollbar specifically for fixed columns, allowing users to scroll horizontally within the fixed section when its content exceeds the available width.
ShowVerticalScrollBarOnFixedColumns	bool	false	Displays a vertical scrollbar specifically on fixed columns, allowing users to scroll through content within those columns when the content exceeds the visible height. This ensures that fixed columns remain accessible and easy to navigate even with overflow content.
ShowTodayDateAsString	bool	true	Displays the current date as the word "Today" instead of the standard date format (e.g., "7/8/2022"). When this property is set to false, the component will show the full numerical date.

GridAi Properties

Name	Type	Default	Description
Model	string	"gpt-3.5-turbo"	Specifies the AI model utilized to power text generation and other AI-driven functionalities within the application. This setting determines which underlying AI engine is responsible for producing generated content and handling intelligent features.
MaxTokens	int	200	Specifies the maximum number of tokens (which may include words, punctuation, or characters, depending on the model's tokenization method) that the AI is allowed to generate in response to a single request. This limit helps control the length of the output and resource usage.
Temperature	double	0.7	Determines the degree of randomness in the AI-generated output. Lower values yield more deterministic and focused responses, making the AI’s answers predictable and precise. Higher values increase creativity and variability, resulting in more diverse and imaginative responses.
Url	string	""	Specifies the endpoint URL used to send AI-related requests. This is usually the URL of your backend service or proxy, which securely forwards requests to OpenAI or another AI service provider. Ensure this URL points to your server that handles authentication, rate limiting, and any additional processing before communicating with the external AI API.
Key	string	""	The unique API key required to authenticate and authorize requests made to the AI service provider, ensuring secure access and usage tracking for each client application.

GridBehavior Properties

Name	Type	Default	Description
AllowColumnAutoSizeOnDoubleClick	bool	true	Automatically resizes a column to fit its content when the user double-clicks on the right edge of the column header.
AllowRowAutoSizeOnDoubleClick	bool	true	Automatically resizes the row height to fit its content when the bottom border of the row is double-clicked.
AllowRowReorder	bool	false	Specifies whether the functionality to reorder rows—such as through drag-and-drop or other user interactions—is enabled. When set to true, users can change the order of rows within the table or list component.
AllowColumnReorder	bool	false	Specifies whether users are allowed to reorder columns by dragging them to new positions within the table or grid.
AllowColumnFreeze	bool	false	Controls whether users can freeze (or pin) columns using drag-and-drop interactions. - 'When other columns are already frozen/pinned:' Dragging a column into the frozen area will immediately add it to that section. - 'When no columns are currently frozen/pinned:' Dragging a column to the edge of the grid and holding it there for about one second will automatically activate the frozen area and pin the column. Enabling this option provides an intuitive way for users to freeze columns directly from the grid interface.
AllowMouseWheel	bool	true	Specifies whether users can scroll the content using the mouse wheel. If enabled, the mouse wheel will allow vertical or horizontal scrolling within the element; if disabled, mouse wheel actions will have no scrolling effect.
ColumnResizeMode	GridResizeMode	GridResizeMode.None	Specifies how column resizing is handled. In split mode, when a column is resized, its width increases or decreases, and the adjacent (next) column’s width is adjusted in the opposite direction, so the combined width of both columns remains constant. In growAndShrink mode, only the resized column's width changes; the widths of other columns remain unaffected.
RowResizeMode	GridResizeMode	GridResizeMode.None	Specifies how rows are resized within the container. - In the split resize mode, resizing a row will both increase or decrease the height of the target (resized) row and inversely adjust the height of the immediately following (sibling) row, ensuring the total height remains constant. - In the growAndShrink resize mode, only the targeted row's height is adjusted—either increasing or decreasing—without affecting the size of neighboring rows.

GridColumnHeader Properties

Name	Type	Default	Description
Visible	bool	true	Controls whether the column headers are displayed or hidden in the table or grid component.

GridClipboard Properties

Name	Type	Default	Description
Enabled	bool	true	Specifies whether the property is currently active (enabled) or inactive (disabled). You can use this setting to retrieve the current status or to enable or disable the property as needed.
CopyHeadersToClipboard	bool	false	Determines whether the column headers are included when copying data to the clipboard. When enabled, copying data will also copy the column headers; when disabled, only the data will be copied. This setting can be used to set or retrieve the current behavior.
AutoFillMode	GridClipboardAutoFillMode	GridClipboardAutoFillMode.FillSeries	Defines whether and how the values of copied and pasted cells are automatically filled using pattern detection during Drag & Drop or multiple cell selection operations. This setting determines how pasted data is handled: - 'none': No auto-fill or pattern detection is applied. Pasted cells remain as they are, with no changes or repetition beyond what was directly copied. - 'copy': The exact cell values are duplicated into the new locations without attempting to follow or extend any logical sequence or pattern. - 'fillSeries': Enables automatic pattern detection and series continuation. If the selection forms a recognizable sequence—for example, '1, 2'—the pasted cells will extend this pattern (e.g., '1, 2, 3, 4, ...'), filling additional cells with the next values in the detected sequence. This option helps users quickly extend numeric, date, or other discernible patterns when dragging or pasting multiple cells.
OnPasteValue	Action<object>	null	Defines or retrieves a callback function that is triggered when a paste event occurs, allowing custom handling of pasted content.

GridColumn Properties

Name	Type	Default	Description
Align	HorizontalAlignment	HorizontalAlignment.Left	Sets or gets the column's header alignment. Accepts: HorizontalAlignment.Left, HorizontalAlignment.Center, HorizontalAlignment.Right
AllowExport	bool	true	Sets or gets whether the column can be exported.
AllowGroup	bool	true	Sets or gets whether the column can be grouped.
AllowHide	bool	true	Sets or gets whether the column can be hidden.
AllowSelect	bool	true	Sets or gets whether the column can be selected.
AllowEdit	object	true	Sets or gets whether the column can be edited. The property can be 'boolean' i.e accept true and false values. To dynamically determine which cells are editable, a callback function can be supplied to the 'allowEdit' property. For example: allowEdit: (id, dataField, value, data) => { return value === 'Cappuccino'; }
AllowSort	bool	true	Sets or gets whether the column can be sorted.
AllowHeaderEdit	bool	true	Sets or gets whether the column can be edited, when header editing is enabled.
AllowFilter	bool	true	Sets or gets whether the column can be filtered.
AllowReorder	bool	true	Sets or gets whether the column can be reordered.
AllowResize	bool	true	Sets or gets whether the column can be resized.
AllowNull	bool	true	Sets or gets whether the column can have 'null' values.
CardHeight	int	0	Sets or gets the cell's height in card view mode.
CellsFormat	string	""	Defines the format applied to the column's cell values. Supports number and date format strings. Examples for numeric formatting: 'd' - Decimal numbers (e.g., 25) 'f' - Floating-point numbers (e.g., 25.50) 'n' - Integer numbers with thousands separator (e.g., 1,000) 'c' - Currency format (e.g., $25.50) 'p' - Percentage format (e.g., 50%) To define decimal places, append a number (e.g., 'c2' = $25.26). Examples for date formatting: 'd' - Short date (e.g., 3/25/2025) 'D' - Long date (e.g., Tuesday, March 25, 2025) 't' - Short time (e.g., 1:30 PM) 'T' - Long time (e.g., 1:30:45 PM) 'f' - Long date + short time 'F' - Long date + long time 'M' - Month/day (e.g., March 25) 'Y' - Year and month (e.g., 2025 March) 'S' - Sortable, culture-invariant format (e.g., 2025-03-25T13:30:45) Custom date format tokens: 'dd' - Day of month (e.g., 01-31) 'MMMM' - Full month name 'yyyy' - 4-digit year And many more standard date/time tokens
CellsAlign	HorizontalAlignment	HorizontalAlignment.Left	Controls the horizontal alignment of cell content. Acceptable values: 'left' - Aligns content to the left 'right' - Aligns content to the right 'center' - Centers content horizontally
CellsWrap	bool	false	Sets or gets the column's cells wrapping. Accepts: true or false.
CellsVerticalAlign	VerticalAlignment	VerticalAlignment.Center	Sets or gets the column's cells vertical alignment. Accepts: VerticalAlignment.Top, VerticalAlignment.Center, VerticalAlignment.Bottom
ClassName	string	""	Sets or gets the column's header CSS class name. You can apply multiple CSS class names by separating them with space.
CellsClassName	object	""	Sets or gets the column's cells CSS class name(s). The property can be used with string and function. You can apply multiple CSS class names by separating them with space or you can return a CSS class name(s) when you use it as a function. The function gets called with the following parameters: index - row's index, dataField - column's data field, cellValue - current cell's value, rowData - current row's data, row - GridRow object. Ex: cellsClassName: (index, dataField, value, rowData, row) => { if (index === 0) { return 'cell-class-1' } }
CellsCSSRules	object	null	Sets or gets the column's cells CSS class rules. Different CSS class names are conditionally applied. Example: label: 'Quantity', dataField: 'quantity', editor: 'numberInput', cellsClassRules: { 'one': settings => settings.value > 5, 'two': settings => settings.value <5, 'three': settings => settings.value === 3 }. The settings object contains the following properties: index, value, dataField, row, api.
CellsRenderer	Func<object, string, object, object, object, string>	null	Sets or gets the column's cells renderer function for custom html rendering in the cells. For more advanced scenarios use formatFunction or template, but for simple html rendering, you can use this.
ColumnGroup	string	""	Sets the name of the column group.
DataField	string	""	Sets or gets the column's data source bound field.
DataType	string	"string"	Sets or gets the column's data type. Any of the following value is valid: 'string', 'number', 'int', 'date', 'bool', 'object', 'any'
DisplayField	string	""	Sets or gets the column's data source bound field which will be displayed to the user. When the property is not set, it is equal to the 'dataField'.
Description	string	""	Sets or gets the column's description. The description of the column is displayed in the column's header, when the end-user moves the pointer over the description button. 'showDescriptionButton' property determines whether the description button is visible.
DataSet	object	null	Sets or gets custom data object related to the column.
Element	object	null	Gets the HTML Element. The property returns null when the Column is not in the View.
Editor	object	null	Sets or gets the column's editor. The property expects 'input', 'autoComplete', 'comboBox', 'dropDownList', 'image', 'numberInput', 'checkBox', 'multiInput', 'multiComboInput', 'checkInput', 'slider', 'dateTimePicker', 'timeInput', 'dateInput', 'dateRangeInput', 'maskedTextBox', 'textArea' or a custom object with 'template' property which defines the editor type, 'settings' property which defines the custom editor's properties, 'onInit(int row, string column, object editor, object rowData): void', 'onRender(int row, string column, object editor, object rowData): void', 'setValue(object value): void' and 'getValue(object value): any' callback functions.
Freeze	string	"false"	Sets or gets the Freeze mode. Accepts: 'near', 'far', true and false. Freezes/Pins the column to left(near) or right(far).
Filter	string	""	Sets or gets the filter of the column. Example: ['contains Andrew or contains Nancy']. Example with numeric filter ['quantity', '<= 3 and >= 8']. Additional example with filter which we want to apply to a column with filterMenuMode='excel' - ['EQUAL' 'Andrew' or 'EQUAL' 'Antoni' or 'EQUAL' 'Beate']. Example with a string filter applied to a string column - ['CONTAINS' 'burke' or 'CONTAINS' 'peterson']. Filter conditions which you can use in the expressions: '=', 'EQUAL','<>', 'NOT_EQUAL', '!=', '<', 'LESS_THAN','>', 'GREATER_THAN', '<=', 'LESS_THAN_OR_EQUAL', '>=', 'GREATER_THAN_OR_EQUAL','starts with', 'STARTS_WITH','ends with', 'ENDS_WITH', '', 'EMPTY', 'CONTAINS','DOES_NOT_CONTAIN', 'NULL','NOT_NULL'
FilterMenuMode	GridColumnFilterMenuMode	GridColumnFilterMenuMode.Default	Sets or gets the filter menu mode of the column. In 'basic' mode, a single input is displayed in the filter menu. In 'default' mode, two input options are available for more precise filtering. In 'excel' mode, checked list with unique values is displayed.
FilterEditor	object	null	Sets or gets the column's filter editor. The value is an object with the following possible options: template: string, condition: string, onInit: any - callback function for init purposes, min: number, max: number, minLength: number, maxLength: number
FormatSettings	object	new object()	Defines the formatting settings applied to the column's values. You can use built-in formatting options or provide advanced internationalization formats using Intl objects. For example, to apply currency formatting: 'Intl: { NumberFormat: { style: "currency", currency: "EUR" } }', or for date formatting: 'Intl: { DateTimeFormat: { dateStyle: "full" } }'.
Formula	string	""	Sets or gets the column's formula. The formula you set will be applied to all cells. Example: COL(Name) & '-' & COL(Price) or IF(COL(Price) * COL(Quantity) > 5, 'Yes', 'No')
Group	string	""	Sets or gets the column's group.
GetCellValue	object	null	This function allows you to provide custom cell values, which will be displayed in the column's cells. The grid passes 3 arguments to the function - row id, column's dataField and row's data.
GetFilterPanel	object	null	Gets the column's filter panel. The function should return HTMLElement which will represent the filter UI panel displayed in the filter menu. The function works in combination with updateFilterPanel
Icon	string	""	Sets or gets the column's icon. Expects CSS class name.
Label	string	""	Sets or gets the text displayed in the column's header.
LabelTemplate	object	""	Sets or gets the column header's template. The property expects the 'id' of HTMLTemplateElement, HTML string or function which returns html string.
MinWidth	int	30	Sets or gets the minimum width.
RowSpan	int	-1	Sets or gets the column's rowSpan function. Allows you to dynamically span cells.
RelationId	string	""	Defines the unique identifier of a relation within dataSourceSettings.relations. Must be used together with the 'relationField' property to establish the relationship mapping.
RelationField	string	""	Specifies the data field within the current data source that participates in the relationship defined by 'relationId'. Both 'relationField' and 'relationId' must be configured to create a valid relation.
Options	IEnumerable<object>	new List<object>()	Sets or gets the column options for editors such as list, dropdownlist or tags.
SortOrder	GridColumnSortOrder	GridColumnSortOrder.None	Sets or gets the sort order of the column. Accepts: 'asc', 'desc', 'none' and null.
SortIndex	int	-1	Sets or gets the sort index of the column. Accepts an integer value. This property can be used to get or set the column's sort index when sorting mode is 'many'.
SortComparator	object	null	Sets or gets a custom 'sortComparator' function. It can be used for implementing custom sorting. Ex: sortComparator: (value1, value2) => { if (value1 === value2) return 0; return value1 <value2; }
ShowActionButton	bool	true	Sets or gets whether the column's header action drop-down button is displayed. This button opens the column's menu.
ShowIcon	bool	false	Sets or gets whether the column's header icon is displayed.
ShowDescriptionButton	bool	false	Sets or gets whether the column's header description button is displayed.
Width	object	""	Sets or gets the width. Accepts: 'number', 'px', 'em', 'auto', 'null' values.
Template	object	""	Sets or gets the column's template. The property expects the 'id' of HTMLTemplateElement or HTML string which is displayed in the cells. Built-in string values are: 'checkBox', 'switchButton', 'url', 'email', 'dropdownlist', 'list', 'progress', 'tags', 'autoNumber', 'modifiedBy', 'createdBy', 'createdTime', 'modifiedTime', 'images', 'checklist', 'attachments', 'sparklines', 'richText', 'color', 'rating', 'duration', 'startDate', 'dueDates'. For example, when you set the template to 'url', the cells will be render anchor tags. When you set the template property to HTMLTemplateElement you should consider that once a template is rendered, the formatObject.template property stores the rendered template component for further use.
TemplateSettings	object	null	Sets or gets additional settings related to the column's template. For example, when the template is 'sparklines', the templateSettings could be an object which defines has 'type' - 'bar', 'column', 'line' or 'pie'. If you want to apply a custom color, you can add the 'colorFunction: function(value) { } and return a custom color as a 'hex' string or a 'tooltipFormatFunction: function(value) {}' which returns a formatted tooltip string. Additional properties are 'min', 'max', 'gap' and 'strokeWidth'.
ValidationRules	IEnumerable<object>	null	Sets or gets the column's validation rules. The expected value is an Array of Objects. Each object should have a 'type' property that can be set to 'required', 'min', 'max', 'minLength', 'maxLength', 'email', 'null', 'requiredTrue', 'minData', 'maxDate', 'pattern'. The 'value' property should be set, too. For validation rule types 'required', 'requiredTrue' and 'null' you can skip the 'value' property. Optional property is 'message', which determines the error message.
VerticalAlign	VerticalAlignment	VerticalAlignment.Center	Sets or gets the column's header vertical alignment. Accepts: VerticalAlignment.Top, VerticalAlignment.Center, VerticalAlignment.Bottom
Summary	string[]	new string[]{}	Sets or gets the column summary. The property should be set to an array with the following possible values: 'sum', 'min', 'max', 'avg', 'count', 'median', 'stdev', 'stdevp', 'var', 'varp'.
UpdateFilterPanel	object	null	Updates the column's filter panel. The function works in combination with getFilterPanel
Visible	bool	true	Sets or gets whether the column is visible. Set the property to 'false' to hide the column.

GridContextMenu Properties

Name	Type	Default	Description
Enabled	bool	false	Controls the visibility of the context menu within the component. When set to true, the context menu appears upon right-clicking a row, allowing users to access additional actions. If set to false, the context menu is disabled and will not appear when users right-click on a row. This property can be used to enable or restrict context menu interactions as needed.
CustomContextMenuItems	IEnumerable<object>	null	Defines an array of custom context menu items that will appear when the user opens the context menu. Each item in the array specifies the label, action, and additional options for the menu entry, enabling developers to tailor the context menu to their application's specific requirements.
DataSource	GridContextMenuDataSource	new GridContextMenuDataSource()	Associates a list of data sources with the context menu, enabling dynamic population of menu items based on the specified data. This allows the context menu to display relevant options according to the provided data sources.
Selector	string	""	Specifies the ID or CSS class selector of a Smart.Menu component that will be used as the context menu for the Grid. This allows you to assign a custom menu that appears when users right-click on the Grid. The value should correspond to the Smart.Menu element’s unique ID (preceded by “#”) or a CSS class (preceded by “.”).
Width	int	250	Specifies the width of the context menu in pixels. Adjusting this value determines how wide the context menu appears when displayed to users. This property helps ensure the menu fits its content appropriately and aligns with your application's design requirements.
Height	int?	null	Specifies the vertical size of the context menu in pixels, determining how much space it occupies on the screen. Adjusting this value controls the overall height of the menu, which can affect the visibility and accessibility of its menu items.

GridContextMenuDataSource Properties

Name	Type	Default	Description
ContextMenuItemDelete	GridCommand	new GridCommand()	Provides the structure and parameters required to delete an item, including details such as the unique identifier of the item to be removed and any necessary authentication or validation information. Outlines the expected request format and possible responses for a delete operation.
ContextMenuItemEdit	GridCommand	new GridCommand()	Provides a detailed schema for the "edit item" operation, outlining the structure and fields required to update an existing item's information. This includes the item's unique identifier and any attributes that can be modified, ensuring accurate and efficient editing of item details within the application.
ContextMenuItemCustom	GridCommand	new GridCommand()	Provides detailed information about the custom item, including its properties, attributes, and any associated metadata used for configuration and display within the application.

GridCommand Properties

Name	Type	Default	Description
Command	string	"contextMenuItemDeleteCommand"	Defines the specific command or action that will be executed when the user selects this item from the context menu. This property links the menu item to a corresponding function or handler in your application logic.
Enabled	bool	true	Activates and displays the context menu item, making it available for user interaction within the application's right-click or context menu interface.
Visible	bool	true	Controls whether the context menu item is visible to the user. When set to true, the item will appear in the context menu; when set to false, it will be hidden and not accessible through the menu interface.
Icon	string	"jqx-icon-delete"	Specifies the icon image to display next to the context menu item, enhancing its visual appearance and helping users quickly identify the item's function. Accepts a URL or a predefined icon identifier, depending on the implementation.
Label	string	"{{messages}}"	Specifies the text that appears as the label for the context menu item, allowing users to identify and select the menu option within the context menu.

GridColumnMenu Properties

Name	Type	Default	Description
AutoClose	bool	true	Automatically closes the column menu when it is open. This ensures the menu is hidden from view, typically after a user action such as selecting an option or clicking outside the menu. This helps improve user experience by keeping the interface clean and responsive.
DataSource	GridColumnMenuDataSource	new GridColumnMenuDataSource()	Specifies the data sources available for selection or display within the column menu, allowing users to choose or interact with different data sets directly from the column menu interface.
Visible	bool	false	Retrieves the current visibility status of the column menu. This function returns true if the column menu is currently displayed to the user; otherwise, it returns false.
Enabled	bool	false	Controls the visibility of the column menu. When set to true, the column menu appears when the user hovers over the column header, providing additional options for manipulating the column. If set to false, the column menu is disabled and will not be displayed on hover. This property can be used to enable or disable the column menu programmatically.
Width	int	250	Specifies the width, in pixels, of the column menu panel. This determines how wide the menu appears when a user opens the column options in the table or grid interface. Adjust this value to control the available space for menu items and improve usability.
Height	int?	null	Defines the vertical height, in pixels, of the column menu component. Adjusting this value determines how much vertical space the column menu occupies, which can impact the display and usability of the menu's content items.

GridColumnMenuDataSource Properties

Name	Type	Default	Description
ColumnMenuCustomizeType	GridCommand	new GridCommand()	Provides configuration options for customizing the appearance and behavior of the column menu, including settings for menu item visibility, ordering, and custom actions.
ColumnMenuItemRename	GridCommand	new GridCommand()	Provides configuration options for the "Rename" item within a column menu. Defines how the rename functionality behaves and appears in the column menu, including available settings such as labels, visibility, and callbacks for renaming actions.
ColumnMenuItemEditDescription	GridCommand	new GridCommand()	Provides configuration options for customizing the edit description feature within a column menu item, allowing you to define how the description field appears, behaves, and is edited by users in the menu.
ColumnMenuItemClone	GridCommand	new GridCommand()	Provides the configuration options for the "Duplicate" item within the column menu, allowing developers to customize its behavior, appearance, and availability in the user interface.
ColumnMenuItemInsertLeft	GridCommand	new GridCommand()	Provides the configuration settings for the "Insert Left" option in the column menu, allowing customization of its behavior, appearance, and availability within the user interface.
ColumnMenuItemInsertRight	GridCommand	new GridCommand()	Provides detailed configuration options for the "Insert Right" menu item within a column menu. Specifies how the "Insert Right" action appears and behaves when users interact with the column menu, including display text, icons, visibility, and event handling.
ColumnMenuItemSortAsc	GridCommand	new GridCommand()	Provides configuration options for the "Sort Ascending" item in the column menu, allowing you to customize its appearance, behavior, and availability within the menu. This includes enabling or disabling the sort option, modifying its display text, and adjusting its icon or associated actions.
ColumnMenuItemSortDesc	GridCommand	new GridCommand()	Provides configuration options for the "Sort Descending" action within the column menu, allowing customization of its appearance, behavior, and accessibility in sortable grid or table components.
ColumnMenuItemSort	GridCommand	new GridCommand()	Provides configuration options for the column menu item that enables users to add sorting functionality to table columns, allowing customization of sorting behavior and display within the column menu.
ColumnMenuItemRemoveSort	GridCommand	new GridCommand()	Provides configuration options for the "Remove Sort" item within a column's menu, allowing you to customize its appearance, behavior, and availability in the column menu interface.
ColumnMenuItemFilter	GridCommand	new GridCommand()	Provides detailed configuration options for the filter functionality within a column menu item, allowing customization of filtering behavior, appearance, and available filter types in the column menu of a data grid or table component.
ColumnMenuItemRemoveFilter	GridCommand	new GridCommand()	Provides configuration options for the "Remove Filter" item within the column menu, allowing customization of its appearance, behavior, and availability.
ColumnMenuItemGroupBy	GridCommand	new GridCommand()	Provides the configuration options for the 'Group By' item within the column menu, allowing customization of grouping behavior, display text, and related features in the column menu interface.
ColumnMenuItemRemoveGroupBy	GridCommand	new GridCommand()	Provides configuration options for the "Group By" feature within a column menu, allowing you to customize how columns are grouped, displayed, and interacted with in the menu interface.
ColumnMenuItemHide	GridCommand	new GridCommand()	Provides the configuration options for the "Hide" menu item within the column menu, allowing developers to control the visibility settings and behavior of column hiding functionality in the grid.
ColumnMenuItemDelete	GridCommand	new GridCommand()	Provides configuration options for the "Delete" item within the column menu, allowing you to customize its behavior, appearance, and availability in the menu.

GridColumnGroup Properties

Name	Type	Default	Description
Label	string	""	Sets the label.
LabelTemplate	object	""	Sets or gets the column header's template. The property expects the 'id' of HTMLTemplateElement, HTML string or function which returns html string.
Align	HorizontalAlignment	HorizontalAlignment.Center	Sets the align.
Name	string	""	Sets the name of the column group.
ParentGroup	string	""	Sets the name of the parent column group.
VerticalAlign	VerticalAlignment	VerticalAlignment.Center	Sets the vertical align.

GridConditionalFormatting Properties

Name	Type	Default	Description
Column	string	"all"	The data field of a numeric column to format. Set 'all' to format all numeric columns.
Condition	GridConditionalFormattingCondition	GridConditionalFormattingCondition.LessThan	The formatting condition.
FirstValue	int	0	The value to compare by. When condition is 'between', this is the start (from) value.
FontFamily	string	""	The fontFamily to apply to formatted cells.
FontSize	string	"The default fontSize as set in CSS"	The fontSize to apply to formatted cells.
Highlight	string	"The default backgroundColor as set in CSS"	The background color to apply to formatted cells.
SecondValue	int	1	When condition is 'between', this is the end (to) value. Otherwise, this value is not used.
Text	string	"The default color as set in CSS"	The text color to apply to formatted cells.

GridCharting Properties

Name	Type	Default	Description
Enabled	bool	false	Specifies whether charting functionality is enabled. When set to true, charting features are available to users; when false, all chart-related features are disabled. This property can be used to retrieve the current status or to enable/disable charting dynamically.
ColorScheme	string	"scheme01"	Sets or retrieves the color palette used for chart elements. This property accepts values that correspond to the 'colorScheme' options available in our Chart component, allowing you to customize or match the chart's appearance to your application's theme.
AppendTo	string	null	Specifies the HTML element that serves as the container for the chart. When set, the chart will be rendered inside the given element. When retrieved, returns the current container element associated with the chart.
Dialog	Dialog	new Dialog()	"Retrieves or configures the charting dialog component. Use this property to access the current charting dialog instance or to assign a new dialog interface for displaying and customizing chart settings within the application."

Dialog Properties

Name	Type	Default	Description
Header	string	"{{message}}"	Sets or retrieves the text or content displayed in the dialog's header section. This property allows you to customize what appears at the top of the dialog, such as a title, instructions, or branding. When used as a setter, it updates the displayed header; when used as a getter, it returns the current header value.
Height	int	400	Specifies or retrieves the height of the dialog window. When set, this property defines the vertical size of the dialog in pixels or other valid CSS units. When accessed, it returns the current height value applied to the dialog.
Width	int	400	Specifies the width of the dialog. You can use this property to set a custom width for the dialog, or retrieve its current width value. Accepts values in CSS units such as pixels (e.g., '400px'), percentages (e.g., '50%'), or other valid CSS width formats.
Left	object	"center"	Specifies or retrieves the horizontal position (in pixels) of the dialog's left edge relative to its containing element or the viewport. This property allows you to set where the dialog appears from the left side, or to obtain its current left offset.
Top	object	"center"	Specifies or retrieves the distance, in pixels, between the top edge of the dialog and the top edge of the containing element or viewport. This property allows you to programmatically set or obtain the vertical position of the dialog on the screen.
Enabled	bool	true	Specifies or retrieves whether the dialog is currently enabled. When set to true, the dialog is active and can interact with user input; when set to false, the dialog is disabled and user interaction is blocked.
Visible	bool	false	Determines whether the dialog is currently visible on the screen. Returns true if the dialog is being displayed; otherwise, returns false.

GridCheckBoxes Properties

Name	Type	Default	Description
Visible	bool	false	Controls whether the checkboxes in the TreeGrid are displayed or hidden, allowing you to enable or disable checkbox visibility for tree nodes.
HasThreeStates	bool	false	Enables or disables the three-state mode for TreeGrid checkboxes. When three-state mode is enabled, selecting or deselecting a checkbox will cascade the change to all its child rows, and parent row checkboxes will automatically reflect the checked, unchecked, or indeterminate state based on the selection status of their child rows. This ensures hierarchical relationships are visually and functionally represented in the checkbox states.

GridDataExport Properties

Name	Type	Default	Description
Header	bool	true	Determines whether the column headers are included when exporting the data. If enabled, the exported file will contain the header row with column names; if disabled, only the data rows will be exported without column headers.
FilterBy	object	null	Determines if the current export includes only the data that matches the filters applied in the interface. When enabled, only filtered results will be exported; when disabled, the export will contain all available data regardless of active filters.
GroupBy	object	null	Specifies the grouping criteria applied to the exported data, determining how records are organized into distinct groups in the exported file. This setting allows you to control the categorization or segmentation of data during the export process.
Style	object	null	Specifies a custom style object to format the appearance of the dataExport, allowing you to define properties such as fonts, colors, borders, and cell alignment for the exported data.
FileName	string	"jqxGrid"	Specifies the name that will be assigned to the exported file when it is saved or downloaded.
PageOrientation	GridDataExportPageOrientation	GridDataExportPageOrientation.Portrait	Specifies the orientation of the page (portrait or landscape) when exporting the document to PDF format. This setting determines how the content is laid out on each PDF page.
ExpandChar	string	"+"	Specifies the character or symbol shown for expanded rows in a Grid with row hierarchy (such as a TreeGrid or Grouped Grid) when the data is exported. This character visually indicates expanded nodes in the exported file.
CollapseChar	string	"-"	Specifies the character or symbol used to represent collapsed rows when exporting a Grid that includes row hierarchy features, such as TreeGrid or grouped rows. This character will indicate collapsed states in the exported file.
View	bool	false	Exports only the data currently visible in the Grid, excluding any rows or columns that are filtered, hidden, or outside the current viewport.
ViewStart	int?	null	Specifies the starting row index for data export or printing operations. This determines which row the process will begin from. Ensure that the 'view' parameter is set to true for this setting to take effect.
ViewEnd	int?	null	Specifies the index of the last row to be included during export or print operations. When using this option, ensure that the 'view' parameter is set to true to apply the index relative to the current view or filtered dataset, rather than the entire data set.
RowIds	IEnumerable<object>	null	An array containing the IDs of the rows that should be included in the export operation. Each element in the array represents the unique identifier of a row to be exported.
HeaderContent	object	null	An array containing custom row objects that will be rendered above the main Grid rows, allowing you to insert additional content or elements before the standard grid data appears.
FooterContent	object	null	A customizable array containing additional row objects that will be appended to the end of the default Grid rows. Use this property to insert extra rows with custom content or functionality after the main set of Grid rows.
AddImageToCell	object	null	This is a callback function designed for inserting images into individual cells during an "Export to Excel" operation. The function receives the following parameters: - 'index': The current cell index in the export process. - 'dataField': The field name associated with the current cell's data. - 'value': The image data, typically as a base64-encoded string. - 'values': An array containing all values for the entire column being exported. The function should return an object that defines the image to be placed in the Excel cell. The returned object has the following structure: '''javascript return { image: { id: 'myImage' + index, // Unique identifier for the image. base64: value, // Base64-encoded image data. imageType: 'jpeg', // Image format, e.g., 'jpeg' or 'png'. width: 20, // Image width, in Excel units (pixels or points). height: 11, // Image height, in Excel units. position: { offsetX: 10 + (25 * values.indexOf(value)), // Horizontal offset for image positioning in the cell. offsetY: 5.5 // Vertical offset for image positioning in the cell. } } }; ''' This object specifies: - The image's unique ID and format. - The image's visual size within the cell. - The position offsets to control exactly where the image appears inside the cell. By customizing these properties, you can control how images are embedded and displayed for each Excel cell during export.
SetRowHeight	object	null	This function enables you to customize the height of each row when exporting data to Excel. It receives the row index as a parameter and should return a numeric value representing the desired height for that specific row. By using this function, you can dynamically control the appearance of rows in your exported Excel file, such as setting different heights for header, data, or summary rows.
GetSpreadsheets	object	null	Defines a function that enables you to include additional data in the Excel export, allowing you to create and export multiple sheets within a single Excel file. This function provides flexibility to specify extra datasets or customize the content of each sheet according to your requirements.
ExportStyles	bool	true	A function that enables you to export a data grid—complete with applied styles and formatting—directly to an Excel file, preserving the grid’s visual appearance and structure in the exported document.
FreezeHeader	bool	false	Determines whether the header row remains fixed (frozen) at the top of the worksheet when the data is exported to Excel. If enabled, users can scroll through the exported data while still viewing the column headers.
AutoConvertFormulas	bool	true	Determines if formulas in the exported Excel file will be automatically converted to their corresponding calculated values. When enabled, all formulas are replaced with their results in the export; when disabled, original formulas are preserved in the Excel sheet.
OnlySelected	bool	false	Determines if only the currently selected cells or rows are exported to Excel, instead of exporting the entire data set. When enabled, only the user's selection will be included in the exported Excel file.
ExportAsTable	bool	false	Specifies whether the data should be exported as an Excel Table (with structured formatting and table features) when using the Export to Excel function. If enabled, the exported file will present the data as an Excel Table; if disabled, the data will be exported as plain worksheet content without table formatting.

GridDataSourceSettings Properties

Name	Type	Default	Description
AutoGenerateColumns	bool	false	Specifies whether a column should be automatically generated by the system (such as for identity or timestamp fields). When set, the column’s value will be created by the database or application rather than provided manually. This property can be read to determine if the column is currently set to auto-generate its values, or written to enable or disable automatic generation.
ChildrenDataField	string	""	Specifies the name of the data field—such as 'children' or 'items'—that contains nested child items within each object in the data source. When this property is set, the IEnumerable<object> searches for this specified field in each item while processing the data. If the field is present, the IEnumerable<object> treats the data as hierarchical and automatically constructs a hierarchical data structure, allowing for nested or tree-like representations. This property can be both retrieved (get) and updated (set) as needed.
SanitizeHTML	GridDataSourceSettingsSanitizeHTML	GridDataSourceSettingsSanitizeHTML.BlackList	Sets or retrieves the root element used for XML data binding. This property specifies the top-level XML element that serves as the entry point for mapping XML data to objects, or for serializing objects to XML.
Root	string	""	Gets or sets the root element used for XML data binding, which serves as the primary node for mapping XML data to object structures or vice versa.
Record	string	""	Gets or sets the XML binding record, which defines the mapping between XML data and the corresponding data structure in the application. Use this property to retrieve the current binding configuration or to assign a new XML binding record for data serialization and deserialization operations.
GroupBy	string[]	new string[]{}	Specifies or retrieves the fields used to group the data. When set, this property determines which data fields will be used to organize the dataset into groups, allowing for aggregation or categorization based on the specified fields.
DataFields	IEnumerable<IGridDataSourceSettingsDataField>	null	Defines or retrieves the schema that describes the structure of the loaded data, including both the field names and their corresponding data types. For example: ['id: number', 'firstName: string', 'lastName: string'] specifies that the data has three fields—id as a number, firstName as a string, and lastName as a string. This property ensures that the data adheres to the expected format for processing and validation.
DataSourceType	GridDataSourceSettingsDataSourceType	GridDataSourceSettingsDataSourceType.Array	Specifies or retrieves the type of data source being used, allowing you to define or query the data source format (such as JSON, XML, or a database connection).
Id	string	""	Sets or retrieves the unique identifier (ID) associated with the IEnumerable<object> instance. This ID can be used to distinguish between multiple IEnumerable<object>s in your application and for referencing or managing them programmatically.
KeyDataField	string	""	Specifies the data field that uniquely identifies each item in the hierarchy, typically using the 'id' field. This property works in conjunction with the parentDataField property, which defines the field that refers to the parent item's identifier (commonly 'parentId'). Together, these fields establish the hierarchical structure by linking each child item to its parent. This property can be used to both set and retrieve the key field used for building the hierarchy.
ParentDataField	string	""	Specifies the data field that identifies the parent node for each item in a hierarchical data structure. This property is used together with the keyDataField property to establish relationships between items—typically, keyDataField refers to the unique identifier of an item (commonly the 'id' field), while the parentDataField references the identifier of the item's parent (often the 'parentId' field). This setup allows the component to construct the hierarchy by linking each item to its parent based on matching key and parent values.
MapChar	string	"."	Updates the value of the 'mapChar' field within the record, assigning it a specified character or string. This field typically stores data related to mapping or identification purposes within the record object.
Relations	object	null	Controls the grid’s relational data configuration. This property accepts an array of relation definition objects, where each object must include the following fields: - 'id' *(string)*: A unique identifier for the relation. - 'label' *(string)*: A descriptive name for the relation, used for display purposes. - 'columns' *(GridColumn[])*: An array of grid column definitions associated with this relation. - 'dataSource' *(any)*: The data source from which related records are retrieved (e.g., an array, function, or external API endpoint). Once you have defined the grid relations, you can reference them in individual column configurations by specifying the 'relationId' (to link the column to a relation) and 'relationField' (to indicate which field from the related data to use). When these properties are set, the grid will automatically generate an appropriate column editor (such as a dropdown or lookup field) that leverages the provided relation settings, streamlining data entry and ensuring data consistency.
VirtualDataSource	Action<object>	null	Defines the virtual data source function, which is invoked by the Grid every time it needs to fetch data—such as when the user scrolls or sorts. This function should use the provided parameters to retrieve or generate the required data, and then pass the results back to the Grid by calling the callback function with the new data set. For example: resultCallbackFunction({dataSource: data}); This approach enables efficient data loading for large datasets by fetching only the necessary records as needed (virtual scrolling). For a working example, refer to the Grid demos page: https://www.htmlelements.com/demos/grid/virtualscroll/
VirtualDataSourceOnExpand	object	null	Enhances the virtual data source during node expansion in Tree and TreeGrid components. When these components are configured with a virtualDataSource, this function is triggered each time a node is expanded and additional data needs to be loaded on demand. It enables efficient, real-time loading of child node data only as needed, supporting large data sets without preloading the entire hierarchy. For implementation details and a live demonstration, see: https://www.htmlelements.com/demos/grid/virtual-tree-grid/

GridDataSourceSettingsDataField Properties

Name	Type	Default	Description
Name	string	""	Sets the dataField name.
Map	string	""	Sets the dataField mapping path. For nested mapping, use '.'. Example: 'name.firstName'.
DataType	GridDataSourceSettingsDataFieldDataType	GridDataSourceSettingsDataFieldDataType.String	Sets the dataField type.

GridEditing Properties

Name	Type	Default	Description
AllowRowHeaderEdit	bool	false	Allows users to edit the content of cells designated as row headers, enabling direct modification of row header values within the table.
AllowColumnHeaderEdit	bool	false	Allows users to edit the text of column headers directly within the interface, enabling customization of header labels according to their preferences or requirements.
AutoUpdateFilterAndSort	bool	true	Automatically reapplies any previously set column filters and sort orders after an edit is made, ensuring that user-defined table views remain consistent and uninterrupted following data modifications.
AllowListOpenOnContentClick	bool	true	Automatically opens the drop-down editor both when the arrow button is clicked and when any item within the drop-down list is selected. This ensures the editor remains accessible regardless of whether the user interacts with the arrow or directly with a list item.
Enabled	bool	false	Allows users to modify or update existing content directly within the interface. This feature typically provides editing controls, such as input fields or rich text editors, enabling seamless changes to data or text as needed.
Batch	bool	false	Enables batch editing functionality, allowing users to modify multiple rows within the grid on the client side before saving any changes. All edits can be submitted together in a single server request, improving efficiency and reducing the number of server calls needed for updates.
Action	GridEditingAction	GridEditingAction.Click	Specifies the method by which the editing mode is activated, such as through a single click, double click, or keyboard action.
ReadOnlyEdit	bool	false	"Read Only Edit is a grid mode where editing a cell does not directly change the underlying data in the grid. Instead, when a cell edit is attempted, the grid triggers the 'onCellEditRequest' callback, allowing your application to handle and process the update request as needed. This mode is useful for implementing custom edit workflows or for integrating with external data sources, as it gives you complete control over how changes are applied."
CommandKeys	GridEditingCommandKeys	new GridEditingCommandKeys()	Provides detailed definitions and mappings for command keyboard shortcuts, specifying the key combinations used to trigger various actions within an application or system.
CommandBar	GridEditingCommandBar	new GridEditingCommandBar()	Defines the configuration options for the grid's command bar, a user interface element that appears as a toolbar or status bar above or below the grid. The command bar provides interactive buttons or tools, such as Save and Revert, allowing users to commit or undo changes made within the grid. These settings control the appearance, available actions, and behavior of the command bar to enhance grid editing workflows.
CommandColumn	GridEditingCommandColumn	new GridEditingCommandColumn()	Defines the configuration options for the grid’s command column. The command column provides action buttons—such as Edit and Delete—that allow users to interact with individual rows. You can customize the available commands, their display order, button text, icons, and event handlers to control how actions are performed on row data.
Mode	GridEditingMode	GridEditingMode.Cell	Enables or configures the grid's cell editing functionality by setting its edit mode. This determines how users can interact with and modify the grid’s cell values—such as enabling inline editing, displaying an edit dialog, or disabling editing entirely.
AddNewRow	GridEditingAddNewRow	new GridEditingAddNewRow()	Defines the configuration options for the 'Add New Row' UI element, which allows users to quickly append new rows to the Grid with a single click. This includes customization of the button’s appearance, position, default values for new rows, and any associated event handlers.
AddNewColumn	GridEditingAddNewColumn	new GridEditingAddNewColumn()	Allows users to dynamically add new columns directly from the user interface. When this feature is enabled, a '+' icon appears as the last column in the table. Clicking the '+' icon opens a dialog window where users can enter details for the new column, facilitating easy and intuitive column creation without leaving the current view.
Dialog	Dialog	new Dialog()	Provides a detailed configuration for the dialog’s editing settings, specifying available editing modes, permissions, interface options, and user interaction behaviors within the dialog component.
AddDialog	Dialog	new Dialog()	Provides detailed configuration options for the settings panel displayed in the "Add" dialog, including field definitions, default values, input validation rules, and UI behavior customizations.
DeleteDialog	Dialog	new Dialog()	Describes delete dialog's settings

GridEditingCommandKeys Properties

Name	Type	Default	Description
CommandKeyEdit	GridCommandKey	new GridCommandKey()	Provides details about the keyboard shortcut or key binding assigned to trigger the edit command within the application. This property specifies which key or key combination the user can press to activate editing functionality.
CommandKeyCancel	GridCommandKey	new GridCommandKey()	Provides details about the "cancel" command key, specifying its function as an input to terminate or interrupt an ongoing operation. This key is commonly used to halt processes, dismiss dialogs, or cancel actions within an application or user interface.
CommandKeyUpdate	GridCommandKey	new GridCommandKey()	Provides detailed information about the "update" command key, specifying its purpose, usage, and expected behavior when invoked within the system. This includes how the "update" command modifies data, any parameters it accepts, and the outcomes or changes it triggers in the application.

GridCommandKey Properties

Name	Type	Default	Description
Command	string	"commandKeyEditCommand"	Specifies the identifier or label used to trigger the edit key command, allowing customization of the keyboard shortcut or command name for editing functionality.
Key	string	"F2"	Specifies the keyboard key or combination of keys that triggers the edit command, allowing users to enter edit mode when the defined key(s) are pressed.

GridEditingCommandBar Properties

Name	Type	Default	Description
Visible	bool	false	Displays the command bar, allowing users to access and execute available commands and features within the application.
Position	LayoutPosition	LayoutPosition.Near	Specifies the location of the command bar within the user interface, determining where it appears on the screen (e.g., top, bottom, left, or right).
DisplayMode	GridCommandDisplayMode	GridCommandDisplayMode.LabelAndIcon	Specifies the content, such as text labels, icons, or both, that will appear on the command bar buttons. This determines the visual elements shown to users within each button on the command bar interface.
DataSource	GridEditingCommandBarDataSource	new GridEditingCommandBarDataSource()	Configures the data source that populates the command bar, determining which commands or actions are displayed to the user. This property specifies where the command bar retrieves its list of available options.

GridEditingCommandBarDataSource Properties

Name	Type	Default	Description
CommandBarAddRow	GridCommand	new GridCommand()	Provides a detailed configuration schema for the "Add Row" button within the command bar, specifying its appearance, behavior, accessibility options, and parameters that control how new rows are added to the underlying data set. This includes properties such as label text, icon, button state (enabled/disabled), event handlers, and any associated tooltips or confirmation dialogs.
CommandBarDeleteRow	GridCommand	new GridCommand()	Provides detailed configuration options for the command bar button specifically used to delete rows, including its label, icon, confirmation prompts, visibility, enabled/disabled state, and any associated callback or event handler functions.
CommandBarBatchSave	GridCommand	new GridCommand()	Provides detailed configuration options for the save button within the command bar, including its label, icon, enabled/disabled state, tooltip text, and associated save action behavior.
CommandBarBatchRevert	GridCommand	new GridCommand()	Provides detailed configuration options for the command bar button that allows users to revert or undo recent changes. This includes settings such as button label, icon, tooltip text, visibility, enabled state, and associated action handlers.

GridEditingCommandColumn Properties

Name	Type	Default	Description
Visible	bool	false	Displays the command column, allowing users to view and interact with available actions or commands for each row within the table.
Inline	bool	false	Displays the command column directly within the main content area (inline), rather than in a separate section. This allows actions like edit or delete to appear alongside each data row for easier, more integrated user interaction.
Position	Position	Position.Far	Specifies the position of the command column within the table, determining where the command buttons (such as edit, delete, or custom actions) will appear relative to other columns.
DisplayMode	GridCommandDisplayMode	GridCommandDisplayMode.Icon	Defines the content or label displayed within the buttons of the command column, such as text, icons, or custom HTML elements. This determines what users see and interact with in each command button cell.
DataSource	GridEditingCommandColumnDataSource	new GridEditingCommandColumnDataSource()	Defines the data source for the command column, specifying which dataset or field the column should retrieve and display its command-related values from. This determines the contents and available actions within the command column.
Width	int?	null	Specifies the width of the command column in the table or grid, determining how much horizontal space is allocated for action buttons or command controls within each row.

GridEditingCommandColumnDataSource Properties

Name	Type	Default	Description
CommandColumnMenu	GridCommand	new GridCommand()	Provides configuration options for the command button displayed in the column header. This button, by default, opens a menu that includes a Column Chooser, allowing users to select which columns are visible in the grid. These settings let you customize the appearance, behavior, and available actions of the command button in the column header.
CommandColumnEdit	GridCommand	new GridCommand()	Provides detailed configuration options for the command column's edit button, allowing customization of its behavior, appearance, and functionality when editing rows in the data grid.
CommandColumnDelete	GridCommand	new GridCommand()	Provides the configuration options for the delete button located in the command column, detailing its appearance, behavior, and functionality when removing rows from the data source.
CommandColumnUpdate	GridCommand	new GridCommand()	Provides configuration options for the update button within the command column, allowing you to customize its appearance, behavior, and actions when updating rows in the data grid.
CommandColumnCancel	GridCommand	new GridCommand()	Provides configuration options for the "Cancel Edit" button within the command column, allowing you to customize its appearance, behavior, and functionality when a user cancels an editing action.
CommandColumnRowMenu	GridCommand	new GridCommand()	Provides detailed configuration options for the row menu button located in the command column, allowing customization of its appearance, behavior, and available menu actions within each row.
CommandColumnCustom	GridCommand	new GridCommand()	Provides configuration options for customizing the appearance and behavior of a custom button within the command column, such as its text, icon, styling, and associated actions.

GridEditingAddNewRow Properties

Name	Type	Default	Description
AutoCreate	bool	false	Inserts a new row when the Enter key is pressed and the currently focused row is the last row in the table. This allows users to quickly add additional rows by pressing Enter at the end of the table.
AutoEdit	bool	true	Specifies whether a newly added row should automatically enter edit mode immediately after it is inserted, allowing the user to edit its contents without requiring an additional action.
Position	LayoutPosition	LayoutPosition.Both	Specifies the exact placement of the ‘Add New Row’ user interface element within the layout. This determines where the button or control for adding a new row will appear on the page, such as at the top, bottom, or a designated section of the grid or form.
DisplayMode	GridEditingAddNewRowDisplayMode	GridEditingAddNewRowDisplayMode.Row	Controls whether the new row action is displayed as a full-width row or as a button. Accepts two values: 'row' to show the action as an entire row, or 'button' to render it as a button element. This property can be used to both retrieve the current display mode and set a new one.
Visible	bool	false	Displays the 'Add New Row' user interface element, allowing users to see and interact with the control for adding a new row to the data table or form.
Label	string	"{{message}}"	Defines the text displayed on the 'Add New Row' button or UI element, allowing customization of the label users see when adding a new row to the interface.

GridEditingAddNewColumn Properties

Name	Type	Default	Description
Visible	bool	false	Displays the 'Add New Row' user interface element, allowing users to view and interact with the option to insert a new row into the dataset or table.

GridFiltering Properties

Name	Type	Default	Description
Enabled	bool	false	Allows users to filter data based on specific criteria, enabling the display of only relevant information according to selected filters.
Operator	string	"and"	Specifies the logical operator ('and' or 'or') used to combine multiple column filters in the Grid. By default, filters are combined using the 'and' operator, meaning that a row must satisfy all filter conditions (e.g., columnA 'and' columnB) to be included in the results. Alternatively, you can set the operator to 'or' to return rows that match 'any' of the filter conditions (e.g., columnA 'or' columnB). 'Example:' '''js grid.filtering.operator = 'or'; grid.addFilter('lastName', 'contains "davolio"'); grid.addFilter('firstName', 'contains "Antoni"'); ''' This configuration applies two filters to the Grid and will display all rows where 'either' 'firstName' contains "Antoni" 'or' 'lastName' contains "Davolio". Use this property to control how multiple filters are combined when filtering data in the Grid.
Filter	IEnumerable<object>	new List<object>()	An array specifying the filtering conditions to be applied to the DataGrid. Each element in the 'filter' array represents a single filter and is itself an array with two elements: 1. 'Column dataField:' The name of the column to which the filter will be applied. 2. 'Filter condition(s):' A string or expression that defines the criteria to filter the column’s data. This can include a condition or multiple conditions combined using logical operators such as 'or' and 'and'. 'Example 1:' To search for rows where the "firstName" column contains 'Andrew' or 'Nancy', and the "quantity" column is either less than or equal to 3 or greater than or equal to 8: '''js [ ['firstName', 'contains Andrew or contains Nancy'], ['quantity', '<= 3 and >= 8'] ] ''' 'Example 2:' For columns configured with 'filterMenuMode: "excel"', you can express multiple "equals" conditions: '''js [ ['firstName', 'EQUAL Andrew or EQUAL Antoni or EQUAL Beate'] ] ''' 'Example 3:' To filter a string column for values containing either 'burke' or 'peterson': '''js [ ['lastName', 'CONTAINS burke or CONTAINS peterson'] ] ''' 'Supported filter operators:' You may use a variety of filter operators and keywords within filter expressions. Common operators include: - Equality: '=', 'EQUAL' - Inequality: '!=', '<>', 'NOT_EQUAL' - Comparison: '<', 'LESS_THAN', '>', 'GREATER_THAN', '<=', 'LESS_THAN_OR_EQUAL', '>=', 'GREATER_THAN_OR_EQUAL' - String matching: 'CONTAINS', 'DOES_NOT_CONTAIN', 'STARTS_WITH', 'ENDS_WITH' - Special: 'EMPTY', 'NULL', 'NOT_NULL' Multiple conditions can be combined in a single expression with logical operators ('and', 'or'). This flexible structure enables complex filtering based on your DataGrid’s current columns and data types.
FilterRow	GridFilteringFilterRow	new GridFilteringFilterRow()	Provides detailed configuration options for the filter row, including its appearance, behavior, available filter types, and display settings. This allows developers to customize how the filter row is shown and how users interact with filtering features in the component.
FilterMenu	GridFilteringFilterMenu	new GridFilteringFilterMenu()	Provides detailed configuration options for the filter menu, including available filter types, display preferences, default selections, and customizable behaviors to control how users interact with and apply filters within the menu interface.
FilterBuilder	GridFilteringFilterBuilder	new GridFilteringFilterBuilder()	(In Development) Provides a comprehensive configuration schema for the filter builder component, detailing available settings and customization options to control its behavior, appearance, and functional parameters during implementation.

GridFilteringFilterRow Properties

Name	Type	Default	Description
Visible	bool	false	Displays the filter row, allowing users to enter criteria and filter the displayed data directly within the grid or table interface.
MenuVisible	bool	false	Displays the filter row’s menu, allowing users to view and interact with filter options for data columns.
ApplyMode	GridFilteringFilterRowApplyMode	GridFilteringFilterRowApplyMode.Auto	Determines how filters entered in the filter row are applied to the data, specifying whether filtering occurs automatically as the user types or only after a specific action, such as pressing Enter or clicking a filter button.
AutoApplyModeDelay	int	300	Specifies the delay, in milliseconds, before the filtering action is triggered after the user modifies a filter input. This setting is only applicable when filtering.filterRow.applyMode is set to 'auto', allowing you to control how quickly the filtering is applied as the user types.

GridFilteringFilterMenu Properties

Name	Type	Default	Description
Visible	bool	true	Controls whether the filter menu is displayed to the user. Set this option to show or hide the filter menu based on your application's requirements.
Buttons	string[]	new string[]{}	Specifies the text label displayed on the filter menu button, allowing you to customize the button’s caption to better describe its function or improve user experience.
Mode	GridFilteringFilterMenuMode	GridFilteringFilterMenuMode.Default	Specifies the display mode for the filter menu, determining how filtering options are presented to the user (e.g., dropdown, modal, or inline).
DataSource	object	null	Configures the data source for the filter menu, specifying the list of available options that users can select when applying filters. This determines which values appear in the filter dropdown and can be set to a static array or a dynamic data source such as an API endpoint or database query.
Width	int	250	Specifies the width, in pixels or a valid CSS unit, of the filter menu component. This determines how wide the filter menu appears in the user interface.
Height	int	200	Specifies the vertical dimension (in pixels, ems, or other supported units) of the filter menu, determining how much space the menu occupies on the screen. Adjusting this value changes the overall height of the filter menu component.

GridFilteringFilterBuilder Properties

Name	Type	Default	Description
Visible	bool	false	Controls whether the filter builder component is displayed or hidden in the user interface. When enabled, users can access and use the filter builder to create or modify filters; when disabled, the filter builder is not visible or accessible.
Height	int?	null	Defines the vertical size, in pixels or other supported units, of the filter builder component. This property determines how tall the filter builder appears in the user interface, allowing you to control its visual layout and accommodate the desired amount of content.

GridFooter Properties

Name	Type	Default	Description
Visible	bool	false	Controls whether the footer section is displayed or hidden on the webpage.
Template	object	""	Defines the layout and content structure for the website footer by specifying a customizable template that determines how footer elements are displayed.

GridGrouping Properties

Name	Type	Default	Description
Enabled	bool	false	Allows items or data to be organized into groups based on specified criteria, making it easier to manage, categorize, or display related elements together within the application.
AllowCollapse	bool	false	Allows users to expand or collapse grouped sections, enabling them to hide or reveal grouped content within the interface as needed.
AutoExpandAll	bool	false	Automatically expands all grouped sections within the interface, making all nested content visible to the user without requiring manual interaction.
AutoExpandToLevel	int	0	Automatically expands all collapsible groups within the interface up to the specified hierarchical level, ensuring that all nested groups at or above this level are visible by default.
AutoHideGroupColumn	bool	false	Automatically hides all columns that are part of a group, streamlining the display by collapsing grouped columns from view. This feature improves user interface clarity by reducing on-screen clutter and allowing users to focus on ungrouped or expanded columns.
ExpandMode	GridGroupingExpandMode	GridGroupingExpandMode.ButtonClick	Specifies how groups are expanded or collapsed within the component. Determines whether groups are expanded by default, collapsed, or if a custom behavior is applied.
GroupRowHeight	object	50	Specifies the height, in pixels, for rows that represent grouping headers within a data grid or table. This determines how much vertical space each group row occupies, ensuring consistent formatting and appearance for grouped data sections.
GroupBy	string[]	new string[]{}	Specifies the data fields used for grouping, or retrieves the current fields that are set for grouping data.
GroupIndent	int	16	Specifies the indentation level for the group, determining the amount of space applied to visually offset the group’s content from the left margin.
GroupBar	GridGroupingGroupBar	new GridGroupingGroupBar()	Provides detailed configuration options for the group bar component, including settings for appearance, behavior, and functionality.
OnGroupDefaultExpanded	object	null	Enhances the first render of the grid by automatically expanding any group that matches a specified condition. For example, using 'onGroupDefaultExpanded: (dataItem) => { return dataItem.label === 'Peppermint Mocha Twist'; }' ensures that the group with the label "Peppermint Mocha Twist" is expanded by default when the grid is initially displayed. This callback receives each group’s data object ('dataItem') and should return 'true' for groups you want to be expanded initially, or 'false' otherwise.
RenderMode	GridGroupingRenderMode	GridGroupingRenderMode.Advanced	Specifies how group headers are displayed within the component. The available options are: - 'basic': Renders group headers without applying any indentation, custom group row heights, or column labels. This provides a simple, minimal display. - 'compact': Similar to 'basic', but additionally includes the column labels in the group headers for improved clarity. - 'advanced' (default): Enhances the group header display by adding indentation based on the group level, allowing nested groups to be visually distinguished. This mode may also support custom group row heights and presents the column labels appropriately. - 'multipleColumns': Displays each group header in its separate column, enabling a more structured and multi-dimensional grouping layout. Choose the mode that best fits the desired visual presentation and complexity of your grouped data.
ToggleButtonIndent	int	16	Specifies the amount of indentation applied to the group toggle button, controlling its horizontal offset or padding relative to its container or content. This affects the visual alignment and spacing of the toggle button within the group interface.
SummaryRow	GridGroupingSummaryRow	new GridGroupingSummaryRow()	Provides configuration options for the group summary row, allowing you to customize its appearance, content, and behavior within grouped data displays.

GridGroupingGroupBar Properties

Name	Type	Default	Description
Visible	bool	false	Displays the group bar, allowing users to view and interact with grouped items or categories within the interface.
AllowColumnDragDrop	bool	false	Allows users to rearrange table columns by dragging and dropping them to new positions, providing a more interactive and customizable table layout.
AllowColumnCloseButtons	bool	true	Displays close (X) buttons on each column header, allowing users to easily remove or hide individual columns from the view.

GridGroupingSummaryRow Properties

Name	Type	Default	Description
Inline	bool	true	Displays the group summary row directly within the main content area, positioning it inline with other rows instead of in a separate section. This setting allows users to view summary information (such as totals or averages) immediately beneath or alongside related grouped data for improved readability and context.
Visible	bool	true	Displays the group summary row, providing an overview of aggregated data—such as totals, averages, or counts—for each group within the dataset.

GridGroupHeader Properties

Name	Type	Default	Description
Visible	bool	false	Controls whether the group header is displayed or hidden, determining its visibility within the user interface.
Template	object	""	Defines the template used to render the header section for a group of items, allowing customization of the group header's layout and content.

GridHeader Properties

Name	Type	Default	Description
Visible	bool	false	Controls whether the header is displayed or hidden in the user interface. Adjusting this setting allows you to show or hide the header as needed.
Template	object	""	Defines a customizable template for rendering the header section, allowing you to specify the structure, content, and styling of the header according to your application's requirements.
OnInit	Action<object>	null	This callback function allows you to customize the Header toolbar by providing direct access to its HTML element. The function receives the Toolbar's HTML Element as an argument, enabling you to modify its structure, add custom buttons, update styles, or bind event listeners according to your application's requirements.
Buttons	string[]	new string[]{}	Specifies which action buttons are shown in the Grid header. The available options are: - ''columns'': Displays a button that opens the columns chooser panel, allowing users to show or hide grid columns. - ''filter'': Displays a button that opens the filtering panel, enabling users to apply filters to grid data. - ''group'': Displays a button that opens the grouping panel, allowing users to group data by specific columns. - ''sort'': Displays a button that opens the sorting panel, letting users sort grid data by one or more columns. - ''format'': Displays a button that opens the conditional formatting panel, providing options to format cells based on specific conditions. - ''search'': Displays a button that opens the search panel, enabling users to search within the grid data. - ''colors'': Displays a button that opens a color options panel, allowing users to customize color formatting for the grid. Include one or more of these options in an array to control the set of action buttons visible in the Grid header.
SearchCommand	GridHeaderSearchCommand	GridHeaderSearchCommand.Search	Specifies the type of search command to be executed, determining how the search operation is performed (e.g., basic, advanced, or filtered search). This setting influences the logic and options available during the search process.
CustomButton	GridCommand	new GridCommand()	Custom Toolbar Button: Enables you to add a user-defined button to the application's toolbar. This feature allows you to specify the button's label, icon, and action, providing easy access to custom functionality directly within the toolbar interface.

GridLayout Properties

Name	Type	Default	Description
AllowCellsWrap	bool	false	Controls whether cell values automatically wrap onto multiple lines. When set to true, text within a cell will wrap to fit the cell's width, displaying content across multiple lines as needed. When set to false, text will remain on a single line, and any overflow may be truncated or hidden based on cell styling.
AutoSizeNewColumn	bool	false	Automatically assigns a default width to any new Column component that does not have its 'width' property explicitly defined. This ensures consistent sizing for all columns, even if a specific width is not provided during the component’s creation.
AutoSizeNewColumnMinWidth	int	250	Specifies the minimum width, in pixels, for the newly created column. This ensures that the column will not shrink below this defined width, maintaining layout consistency and readability.
AutoHeight	bool	false	Dynamically adjusts the height of the Grid component based on its content or container, ensuring optimal layout without manual height specification.
AutoWidth	bool	false	Automatically adjusts the overall width of the Grid based on the combined widths of its columns. To enable this feature, ensure that each column has a numerical value assigned to its ‘width’ property. This allows the Grid to size itself precisely according to the specified widths of all columns.
AutoGenerateColumnWidth	object	null	Defines the width of columns that are automatically generated within the Grid component. This setting determines how wide each auto-created column will appear, ensuring consistent column sizing for dynamically generated data fields.
ColumnWidth	object	null	Specifies the width of each column in the grid layout. This property allows you to define fixed, relative, or auto-sizing widths for grid columns, enabling precise control over the grid's overall structure and appearance.
ColumnHeight	object	null	Specifies the vertical height for each column within the Grid layout. This property determines how tall each column appears, allowing for consistent or customized column heights depending on the value provided.
ColumnMinHeight	int	30	Specifies the minimum height that each column within the Grid can occupy, ensuring that all columns maintain at least this height regardless of their content. This helps maintain a consistent and readable layout by preventing columns from becoming too short.
CardMinWidth	int	250	Defines the lowest allowable width, in pixels or specified units, that a card can be displayed at in card view. This ensures that cards will not shrink below this minimum width, maintaining readability and consistent layout even when the container is resized or when multiple cards are shown side by side.
CardsPerRow	int	-1	Specifies the number of cards displayed in each row, allowing you to control the column layout and adjust how many cards appear side by side within a container.
CardVertical	bool	false	Determines if cards are displayed in a vertical orientation. When enabled, each card arranges its column label above the corresponding column value, creating a top-to-bottom layout rather than the default horizontal (label-value side-by-side) format. This mode enhances readability on narrow screens and improves visual hierarchy by stacking labels above their respective values.
DropDownWidth	int	700	Specifies the width of the Grid component when it is rendered within a drop-down interface. This setting determines how wide the Grid appears in the drop-down, allowing you to control its visual layout and ensure proper alignment with surrounding UI elements.
DropDownHeight	int	500	Specifies the vertical height of the Grid component when it is presented within a drop-down interface. This setting determines how many items or how much content is visible within the drop-down Grid before scrolling is required.
RowMinHeight	int	30	Specifies the minimum height, in pixels or other valid CSS units, that each row in the Grid layout can be resized to. This ensures that no row will be rendered shorter than the defined minimum value, regardless of the content or available space.
RowHeight	object	null	Specifies the height of the grid rows. Accepts the following values: - null: The row height is determined automatically based on the content. - auto: The row height adjusts automatically to fit the content of each row. - A number: Sets a fixed row height in pixels. Use this property to control the vertical sizing behavior of rows within the Grid component.
ViewBarWidth	int	250	Specifies the width of the view bar component, determining how much horizontal space it occupies within the user interface. Adjusting this value will increase or decrease the view bar's width accordingly.

GridPaging Properties

Name	Type	Default	Description
Enabled	bool	false	Enables pagination functionality, allowing data or content to be divided into discrete pages. This feature lets users navigate through large datasets or lists by viewing a limited number of items per page, improving usability and performance. Pagination controls such as next, previous, and specific page numbers may be supported.
Spinner	GridPagingSpinner	new GridPagingSpinner()	Provides detailed configuration options for controlling the appearance and behavior of spinner-based pagination elements, including parameters for speed, size, color, and navigation functionality.
PageSize	int	10	Specifies the maximum number of rows to display on each page of data, enabling pagination and controlling how much content is visible at one time.
PageHierarchySize	int	2	Specifies the maximum number of top-level (root) hierarchical groups to display per page when grouping is enabled. For example, setting this value to 2 will show 2 root groups on each page, with pagination controls provided if there are more groups than the specified limit. This setting applies only when hierarchical grouping is active in the data grid.
PageIndex	int	0	Specifies the initial page or URL that users will see when they first access the application.

GridPagingSpinner Properties

Name	Type	Default	Description
Enabled	bool	false	Activates a spinner-based pagination feature, displaying a loading spinner while additional content is being fetched or loaded as the user navigates through pages. This improves user experience by providing visual feedback during content loading in paginated interfaces.
Step	int	1	Defines the increment or decrement value when navigating between pages, determining how many pages to move forward or backward with each navigation action.

GridPager Properties

Name	Type	Default	Description
AutoEllipsis	GridPagerAutoEllipsis	GridPagerAutoEllipsis.Both	Specifies how ellipsis ("...") should be displayed when text overflows its container. This option determines the placement or behavior of the ellipsis, such as at the start, middle, or end of the truncated text.
Position	LayoutPosition	LayoutPosition.Far	Specifies the location where the pager (pagination controls) will be displayed within the user interface, such as at the top, bottom, or both positions of the component.
Template	object	""	Defines the structure and layout template used to render the pager component, specifying how its elements (such as navigation buttons, page numbers, and labels) are displayed in the user interface.
PageSizeSelector	GridPagerPageSizeSelector	new GridPagerPageSizeSelector()	Specifies the configuration options for determining the number of data rows displayed per page in a paginated view. This setting allows users to control how many items are visible at once, enhancing readability and navigation within data tables or lists.
Summary	GridPagerSummary	new GridPagerSummary()	Provides a detailed configuration for summary settings, specifying options such as display format, data aggregation methods, visibility controls, and customization preferences for how summaries are generated and presented within the application.
NavigationButtons	GridPagerNavigationButtons	new GridPagerNavigationButtons()	Provides configuration options for the navigation buttons, including their appearance, labels, order, and behavior within the user interface.
NavigationInput	GridPagerNavigationInput	new GridPagerNavigationInput()	Provides detailed configuration options for navigation input methods, specifying how users can interact with and navigate through the interface. This includes settings such as input devices supported (keyboard, mouse, touch, etc.), navigation modes, and any customization options for user interaction.
PageIndexSelectors	GridPagerPageIndexSelectors	new GridPagerPageIndexSelectors()	Provides configuration options for the appearance and behavior of the numeric pagination buttons, including properties such as the number of buttons displayed, styling, and event handlers for user interaction.
Visible	bool	false	Controls whether the pager component is visible to users. Set to true to display the pager, or false to hide it.

GridPagerPageSizeSelector Properties

Name	Type	Default	Description
Visible	bool	false	Controls whether the 'Rows Per Page' dropdown is displayed, allowing users to specify how many rows are shown per page in a paginated table or list.
DataSource	object	"10,20,50"	Specifies the number of rows displayed on each page when using the 'rows per page' pagination option. This determines how many items are visible to the user before navigation controls (such as next/previous page) are required.
Position	Position	Position.Far	Specifies the placement of the 'Rows per page' selection control within the pagination component, determining where users can adjust how many items are displayed on each page.

GridPagerSummary Properties

Name	Type	Default	Description
Position	Position	Position.Far	Specifies the location where the summary will be displayed within the component or layout (e.g., top, bottom, left, or right). This property determines the alignment or placement of the summary content relative to other elements.
Visible	bool	false	Controls whether the summary is visible or hidden in the user interface. Determines if the summary section is displayed to the user.

GridPagerNavigationButtons Properties

Name	Type	Default	Description
Position	LayoutPosition	LayoutPosition.Both	Specifies the placement of the navigation buttons within the user interface, allowing you to control where the buttons appear (e.g., top, bottom, left, right, or custom positions) relative to the navigational content.
PrevNextButtons	GridPagerNavigationButtonsPrevNextButtons	new GridPagerNavigationButtonsPrevNextButtons()	Defines the configuration options for the "Previous Page" and "Next Page" buttons, including their appearance, labels, behavior, and navigation functionality within paginated interfaces.
FirstLastButtons	GridPagerNavigationButtonsFirstLastButtons	new GridPagerNavigationButtonsFirstLastButtons()	Provides configuration options for the "First Page" and "Last Page" navigation buttons, specifying their appearance, behavior, and accessibility settings within the user interface.
Labels	GridPagerNavigationButtonsLabels	new GridPagerNavigationButtonsLabels()	Provides detailed configuration options for customizing the text labels displayed on navigation buttons, allowing you to specify and modify the button captions used in the navigation interface.

GridPagerNavigationButtonsPrevNextButtons Properties

Name	Type	Default	Description
Visible	bool	true	Controls whether the 'Previous Page' and 'Next Page' navigation buttons are visible to the user. Set to 'true' to display the buttons, or 'false' to hide them. This option allows you to customize the pagination controls in the interface.

GridPagerNavigationButtonsFirstLastButtons Properties

Name	Type	Default	Description
Visible	bool	true	Controls whether the 'First Page' and 'Last Page' navigation buttons are displayed, allowing users to quickly jump to the beginning or end of a paginated list. Set this option to determine if these navigation buttons should be visible in the pagination controls.

GridPagerNavigationButtonsLabels Properties

Name	Type	Default	Description
Visible	bool	false	Determines whether the labels for navigation buttons are visible to users. When enabled, text labels appear alongside the navigation buttons, providing additional context or descriptions; when disabled, only the button icons are displayed.

GridPagerNavigationInput Properties

Name	Type	Default	Description
Position	Position	Position.Far	Specifies the placement of the navigation input element within the user interface, determining where the navigation control appears on the screen (e.g., top, bottom, left, or right). This setting allows developers to customize the navigation experience according to the application's layout requirements.
Visible	bool	false	Controls whether the navigation input option is visible to users. When enabled, the navigation input will be displayed in the user interface; when disabled, it will be hidden. This property allows developers to dynamically show or hide navigation options based on application state or user permissions.

GridPagerPageIndexSelectors Properties

Name	Type	Default	Description
Visible	bool	true	Controls whether numeric page buttons (representing individual page numbers in pagination controls) are displayed to the user. When enabled, numbered buttons appear, allowing direct navigation to specific pages. When disabled, these numeric buttons are hidden, and users may need to rely on other navigation methods such as "Next" or "Previous" buttons.
DataSource	object	10	Specifies the maximum number of page navigation buttons displayed at once in the pagination control. This determines how many page links are visible to the user before additional pages are hidden or collapsed (e.g., with ellipsis).

GridRowDetail Properties

Name	Type	Default	Description
Enabled	bool	false	Displays additional information for each row by enabling expandable row details functionality.
Height	int	200	Specifies the vertical height, in pixels, for the expanded row details section. This determines how much space is allocated to display additional information beneath a table row when its details are shown.
Position	Position	Position.Near	Specifies the position of the column used to control the dynamic expansion or collapse of row details. This determines where the expand/collapse toggle will appear within the table, allowing users to show or hide additional information for each row.
Template	object	""	Defines the template used to display the detailed content for each row. This property specifies the HTML or component structure that will be rendered when a row is expanded to show additional information.
Visible	bool	true	Controls the visibility of the column that enables users to dynamically expand or collapse the details of a row. When enabled, this column provides an interactive toggle for showing or hiding additional information associated with each row.
Dialog	Dialog	new Dialog()	Configures the display of row details using a dialog window. When enabled, selecting a row will open a modal dialog showing detailed information for that row. This provides a focused view of row details without navigating away from the main content.

GridRow Properties

Name	Type	Default	Description
AllowToggle	bool	true	Sets or gets the row can be expanded or collapsed.
AllowResize	bool	true	Sets or gets the row can be resized.
AllowSelect	bool	true	Sets or gets the row can be selected.
AllowCheck	bool	true	Sets or gets the row can be checked. This property is used when the Grid is in Tree Grid or Grouped mode.
Checked	bool	true	Sets or gets the row's check state. This property is used when the Grid is in Tree Grid or Grouped mode.
Cells	IEnumerable<IGridRowCell>	new List<object>()	Gets the Row's Cells array.
Children	IEnumerable<object>	null	Gets the row's children array of GridRow. This property is associated to the TreeGrid and Groupng mode of the Grid.
Data	object	null	Gets the row's bound data.
DetailHeight	int	200	Sets or gets the row's detail height.
DetailTemplate	object	null	Sets or gets the row's detail template.
Element	object	null	Gets the HTML Element. The property returns null when the Row is not in the View.
IsExpanded	bool	false	Sets or gets the row is expanded. This property is used when the Grid is in Tree Grid or Grouped mode.
Header	object	null	Gets the row's header element.
Height	int	30	Sets or gets the row's height.
Index	int	-1	Gets the row's bound index.
Id	object	""	Gets the row's bound id.
Leaf	bool	false	Gets whether the row is leaf row in TreeGrid or Grouping mode.
MaxHeight	int	100	Sets or gets the row's maximum height.
MinHeight	int	30	Sets or gets the row's minimum height.
Freeze	string	"false"	Sets or gets the Freeze mode. Accepts: 'near', 'far', true and false. Freezes/Pins the row to top(near) or bottom(far).
Selected	bool	false	Sets or gets whether the row is selected.
ShowDetail	bool	false	Sets or gets whether the row detail is displayed.
SetStyle	Action<object>	null	"Method which applies a style object to all cells. Expects a JSON object with the following allowed values: 'background', 'color', 'fontSize', 'fontFamily', 'fontWeight', 'fontStyle', 'textDecoration'
Visible	bool	true	Sets or gets whether the row is visible. Set the property to 'false' to hide the row.
VisibleIndex	int	-1	Gets the visible index of the row.
GetCell	object	-1	Methods which gets a cell, which is inside a row. A dataField string is a required argument, when you call this method.

GridRowCell Properties

Name	Type	Default	Description
Align	string	"left"	"Sets or gets the horizontal alignment. Allowed values are: 'left', 'center' or 'right'".
Column	object	null	Gets the column associated to the cell.
Color	string	""	Sets or gets the cell's text color.
Background	string	""	Sets or gets the cell's background.
BorderColor	string	""	Sets or gets the cell's borderColor.
ColSpan	int	1	Sets or gets the cell's colSpan.
Editor	object	null	Sets or gets the cell's editor.
Element	object	null	Gets the HTMLElement associated to the cell.
GetFormattedValue	Action<object>	null	Gets a formatted number or Date.
IsEditing	bool	false	Gets whether the cell is in edit mode.
OldValue	object	null	Gets the old value of the cell
FontSize	string	""	Sets or gets the cell's fontSize
FontWeight	string	""	Sets or gets the cell's fontWeight
FontFamily	string	""	Sets or gets the cell's fontFamily
FontStyle	string	""	Sets or gets the cell's fontStyle
Readonly	bool	false	"Sets or gets whether the cell can be edited.".
Row	object	null	Gets the row object associated to the cell.
RowSpan	int	1	Sets or gets the row span.
Selected	bool	false	Sets or gets whether the cell is selected.
SetProperties	Action<object>	null	"Each property is an object{name: string, value: any}. This function allows you to update multiple properties with single refresh.".
Tooltip	string	""	"Allowed values are: 'top', 'middle' or 'bottom'".
Value	object	null	The cell's value
VerticalAlign	string	"center"	"Sets or gets the vertical alignment. Allowed values are: 'top', 'center' or 'bottom'".
SetStyle	Action<object>	null	"Method which applies a cell style object. Expects a JSON object with the following possible values: 'background', 'color', 'fontSize', 'fontFamily', 'fontWeight', 'fontStyle', 'textDecoration'

GridSummaryRow Properties

Name	Type	Default	Description
Visible	bool	false	Controls whether the summary row is displayed or hidden in the table.
Editing	bool	false	Enables the summary row editor, allowing users to interactively edit summary row cells. When you hover over a cell in the summary row, an inline editor appears, so you can dynamically change the summary type (e.g., sum, average, count) directly within the table. This feature improves data analysis by making it easy to adjust summary calculations on the fly.

GridStateSettings Properties

Name	Type	Default	Description
AutoSave	bool	false	Controls whether the Grid's current state (such as column order, filter settings, and sorting) is automatically saved or not. When enabled, any changes to the Grid's configuration are stored automatically for later retrieval.
AutoLoad	bool	false	Controls whether the Grid automatically restores its previous state (such as filters, sorting, and column arrangements) when the page is reloaded. When enabled, the Grid will load the saved state on page refresh; when disabled, the Grid will reset to its default configuration.
Enabled	bool	true	Controls whether the grid's current state—such as column order, sorting, filtering, and visibility—is automatically saved and restored when loading or reloading the grid. When enabled, changes made by the user are preserved, providing a consistent experience across sessions. Disabling this option prevents the grid from saving or restoring any state information.
Current	string	""	Sets a new state value or retrieves the current state value. When a value is provided, the state is updated to the new value. If no value is provided, the current state is returned. This is typically used to manage and track changes in application state.
Storage	object	null	A container that automatically stores state objects whenever the saveState method is called or when autoSave is enabled. Each entry in the container uses the state's name as the key and the corresponding value is a JSON object containing that state's properties and data. This structure allows for easy retrieval and management of multiple application states by name.
OnStateChange	object	""	Function invoked whenever the component’s state changes, allowing you to respond to or handle updates accordingly.
Options	string[]	new string[]{}	An array specifying which table state options—such as 'sort', 'filter', 'expandedRows', 'paging', 'selectedCells', 'selectedRows', 'group', and 'columns'—should be persisted. Each value in the array represents a different aspect of the table’s state that can be saved or restored (e.g., saving the current sorting order, applied filters, selected rows, or column configuration). This property allows you to control exactly which parts of the table state are stored and later reloaded, enabling customized persistence and retrieval of user interactions.

GridSelection Properties

Name	Type	Default	Description
Enabled	bool	false	Allows users to select an option from a list, enabling interaction with selectable choices within the user interface.
AllowRowHeaderSelection	bool	false	Determines whether users can select rows by clicking on the row header. When enabled, clicking a row header will select the entire row. This property can be used to either allow or prevent selection through row headers.
AllowColumnHeaderSelection	bool	false	Determines whether users can select a column by clicking on its header. When enabled, clicking a column header will select the entire column. This property can be set to allow or prevent selection via column header clicks, and its current state can be retrieved programmatically.
AllowRowSelection	bool	true	Determines whether selecting a row by clicking on it is enabled. When set to true, users can select rows with a mouse click; when false, clicking a row will not change its selection state. Use this property to control row selection behavior in the interface.
AllowCellSelection	bool	false	Determines whether users are permitted to select a cell by clicking on it. When enabled, clicking on a cell will select it; when disabled, clicking will have no effect on the cell’s selection state. This property can be set to enable or disable cell selection via mouse interaction.
AllowDragSelection	bool	true	Controls whether users can select multiple cells by dragging the mouse across them, similar to how selection works in Excel. When enabled, users can click and drag to highlight a range of cells; when disabled, selection by dragging is not permitted. This property can be set or retrieved programmatically.
AllowDragSelectionAutoScroll	bool	true	Determines whether the Grid view will automatically scroll when a user selects items by dragging the mouse beyond the current visible area. This property can be set to enable or disable auto-scrolling during drag selection, or retrieved to check the current behavior.
AllowCellDragSelectionHandle	bool	true	Controls the visibility of the selection "Drag Handle" (the small square located at the bottom-right corner of a selected cell range, similar to Excel). When enabled, this handle allows users to extend or resize their current selection horizontally or vertically by dragging the handle. This property can be set to show or hide the drag handle, as well as queried to determine its current state.
AllowCellDragDropSelectionHandle	bool	true	Controls whether cells in the selection can be dragged and dropped. When enabled, dragging is initiated by moving the cursor to the bottom edge of the selected cells, causing the cursor to change to a "drag" icon. Clicking and holding the mouse button while moving the selection will initiate the drag operation. By default, dropping the selection copies the values of the dragged cells to the new location. This property can be used to enable or disable drag-and-drop functionality for cell selections.
AllowCellDragSelectionAutoFill	bool	true	Controls whether cell selection is automatically populated with values when dragging and releasing the 'Drag Handle'. When enabled, dragging the handle will auto-fill the selected cells with the corresponding values. This property can be set to enable or disable the auto-fill behavior, and can also be used to check the current auto-fill status.
DefaultSelection	bool	false	Determines whether the default browser behavior for text selection is enabled or disabled. When enabled, users can highlight and select text within the element using their mouse or keyboard. When disabled, text selection is prevented, and users cannot highlight the element’s text. This can be useful for UI components where text selection should be restricted, such as buttons or draggable elements.
Mode	GridSelectionMode	GridSelectionMode.Many	Gets or sets the selection mode, determining how users can select items in the control. The available values are: - ''one'': Only a single cell or row can be selected at any given time. - ''many'': Multiple cells or rows can be selected, typically by individually clicking on them. - ''extended'': Multiple cells or rows can be selected using a combination of mouse clicks and keyboard modifiers (such as Shift or Ctrl), allowing for range or non-contiguous selections. Use this property to control whether users can select only one item, several items, or use advanced selection behaviors.
Action	GridSelectionAction	GridSelectionAction.Click	Controls how selection is triggered: accepts 'click' or 'doubleClick' to specify if selection occurs on a single or double mouse click, respectively. When set to 'none', user interaction does not trigger selection—selection can only be managed programmatically via the API.
CheckBoxes	GridSelectionCheckBoxes	new GridSelectionCheckBoxes()
Selected	string	""

GridSelectionCheckBoxes Properties

Name	Type	Default	Description
AutoShow	bool	false	Controls the visibility of checkboxes within the Grid. When set to true, checkboxes are only displayed when the mouse hovers over the Grid. When set to false, checkboxes remain visible at all times, regardless of mouse position. This property can be used to create a cleaner interface by showing checkboxes only on hover.
Enabled	bool	false	Enables or disables the checkbox selection feature. When enabled, an additional column containing checkboxes is displayed, allowing users to select multiple rows. You can use this property to programmatically determine or change whether checkbox selection is active.
Action	GridSelectionAction	GridSelectionAction.Click	Determines how selection is triggered within the component. Accepts the following values: - ''click'': Selection occurs when the user clicks on the item. - ''doubleClick'': Selection occurs when the user double-clicks on the item. - ''none'': Selection cannot be triggered by user interaction; it can only be set or changed programmatically via the API. This property can be used to both retrieve the current selection mode or set a new one.
SelectAllMode	GridSelectionCheckBoxesSelectAllMode	GridSelectionCheckBoxesSelectAllMode.Page	Specifies whether the checkbox selection in the table header will select all rows on the current page, all rows across all pages, or none. When set to 'page', the header checkbox selects only the rows visible on the current page. When set to 'all', it selects every row in the dataset, regardless of pagination. Setting this option to 'none' disables the header checkbox, preventing users from selecting all rows at once.
Position	Position	Position.Near	Sets or retrieves the position of the checkbox selection column within a table or grid, allowing you to specify whether the checkbox column appears at the start (left) or end (right) of the columns.

GridSorting Properties

Name	Type	Default	Description
Enabled	bool	false	Enables sorting functionality, allowing users to organize data in ascending or descending order based on specified fields or columns.
Sort	string[]	new string[]{}	Configures which columns will be used for sorting the data and determines their sort order (e.g., ascending or descending) during the sorting operation.
MaintainSort	bool	true	Ensures that the sorting order is preserved when the user edits data within the currently sorted column. If you want the sorting to be applied only once—so that edited data does not automatically re-sort the column—you can disable this feature by setting the property to false. This allows the column's order to remain unchanged after data edits, rather than reapplying the sort.
Mode	GridSortingMode	GridSortingMode.One	Specifies the maximum number of columns by which users can sort the data. When this property is set to 'many', users are allowed to apply sorting to multiple columns simultaneously, enabling multi-level sorting functionality.
CommandKey	GridSortingCommandKey	GridSortingCommandKey.Default	Specifies which keyboard key activates multi-column sorting. This property determines the key that users must hold down to enable sorting by multiple columns simultaneously. For example, if commandKey is set to 'Control', users can select and sort multiple columns by holding the 'Control' key while clicking on column headers. Adjust this property to match the desired key for multi-column sorting functionality (e.g., 'Alt', 'Shift', or 'Meta').
SortToggleThreeStates	bool	true	Allows users to toggle between three sorting options: ascending order, descending order, and no sorting applied. This functionality enables dynamic changes to the sorting state of a data set or list, providing greater flexibility and control over how information is presented.
SortToggleOnClick	bool	true	Allows users to change the sorting state (e.g., ascending, descending, or none) of a column by clicking its header. This feature is enabled by default, enabling interactive sorting functionality within the table.
SortToggleOnClickAndCommandKey	bool	false	Allows users to toggle through different column sort states (such as ascending, descending, and unsorted) by clicking on a column header. Holding down the Command key while clicking enables multi-column sorting, letting users modify the sort order of multiple columns at once.

GridUploadSettings Properties

Name	Type	Default	Description
Url	string	""	Specifies the URL endpoint used for uploading files or images. This URL is where the files or images will be submitted during the upload process.
RemoveUrl	string	""	Specifies the URL endpoint to handle file or image removal requests. This URL will be used when a file or image needs to be deleted from the server.
Name	string	"userfile[]"	Sets or retrieves the name of the file input field used for uploads. This field name is crucial for accessing uploaded image data on the backend. For example, in an Express.js application handling file uploads (e.g., using multer or a similar middleware), you would use this field name to reference the uploaded files from the request object. If the upload field name is set to "userfile[]", you can access the array of uploaded images in your route handler like so: '''javascript const images = req.files['userfile[]']; ''' Make sure the field name specified here matches the name attribute of your file input element in the frontend form, enabling seamless retrieval of uploaded files on the server side.
Data	string	""	Supplementary information to be sent to the server. This data must be provided as a JSON-formatted string (i.e., a serialized JSON object or array). Ensure all values are properly encoded and the string adheres to valid JSON syntax before submission.
OnUploadCompleted	object	""	"This function is triggered after the upload process completes. When invoked by the Grid, it receives a JSON object as a parameter. The JSON object contains the following properties: - 'files': An array listing the uploaded file(s). - 'status': A string indicating the result of the upload (e.g., 'success', 'error'). - 'fileURL': The URL(s) where the uploaded file(s) can be accessed. - 'serverResponse': The response data returned by the server upon upload completion. Use this function to handle post-upload actions such as updating the UI, processing the server response, or handling errors."
OnUploadError	object	""	This function is triggered when a file upload fails. It receives a JSON object as a parameter, which contains the following properties: - 'files': An array of file objects that failed to upload. - 'status': The HTTP status code or error status associated with the failure. - 'serverResponse': The full response returned by the server, which may include error messages or additional details about the upload failure. This function is automatically invoked by the Grid component whenever an upload error occurs, allowing you to handle the failure appropriately in your code.