Row island
Properties
Section titled "Properties"actionStripComponents
Section titled "actionStripComponents"actionStripComponents: IgcActionStripToken[] addRowEmptyTemplate
Section titled "addRowEmptyTemplate"Gets/Sets a custom template for adding row UI when grid is empty.
addRowEmptyTemplate: (ctx: void) => React.ReactNode advancedFilteringExpressionsTree
Section titled "advancedFilteringExpressionsTree"Gets/Sets the advanced filtering state.
advancedFilteringExpressionsTree: IgrFilteringExpressionsTree allowAdvancedFiltering
Section titled "allowAdvancedFiltering"Gets/Sets a value indicating whether the advanced filtering is enabled.
allowAdvancedFiltering: boolean allowFiltering
Section titled "allowFiltering"Gets/Sets if the filtering is enabled.
allowFiltering: boolean autoGenerate
Section titled "autoGenerate"Gets/Sets whether to auto-generate the columns.
autoGenerate: boolean autoGenerateExclude
Section titled "autoGenerateExclude"Gets/Sets a list of property keys to be excluded from the generated column collection
autoGenerateExclude: string[] batchEditing
Section titled "batchEditing"batchEditing: boolean cellMergeMode
Section titled "cellMergeMode"Gets/Sets cell merge mode.
cellMergeMode: GridCellMergeMode cellSelection
Section titled "cellSelection"Gets/Sets cell selection mode.
cellSelection: GridSelectionMode childDataKey
Section titled "childDataKey"Sets the key of the row island by which child data would be taken from the row data if such is provided.
childDataKey: string childLayoutList
Section titled "childLayoutList"childLayoutList: IgrRowIslandComponent[] clipboardOptions
Section titled "clipboardOptions"Controls the copy behavior of the grid.
clipboardOptions: IgrClipboardOptions columnList
Section titled "columnList"columnList: IgrColumnComponent[] columnSelection
Section titled "columnSelection"Gets/Sets column selection mode
columnSelection: GridSelectionMode columnWidth
Section titled "columnWidth"Gets/Sets the default width of the columns.
columnWidth: string dataCloneStrategy
Section titled "dataCloneStrategy"Gets/Sets the data clone strategy of the grid when in edit mode.
dataCloneStrategy: IgrDataCloneStrategy dragGhostCustomTemplate
Section titled "dragGhostCustomTemplate"Gets the custom template, if any, used for row drag ghost.
dragGhostCustomTemplate: (ctx: IgrGridRowDragGhostContext) => React.ReactNode dragIndicatorIconTemplate
Section titled "dragIndicatorIconTemplate"The custom template, if any, that should be used when rendering the row drag indicator icon
dragIndicatorIconTemplate: (ctx: IgrGridEmptyTemplateContext) => React.ReactNode emptyFilteredGridMessage
Section titled "emptyFilteredGridMessage"Gets/Sets the message displayed when there are no records and the grid is filtered.
emptyFilteredGridMessage: string emptyGridMessage
Section titled "emptyGridMessage"Get/Sets the message displayed when there are no records.
emptyGridMessage: string emptyGridTemplate
Section titled "emptyGridTemplate"Gets/Sets a custom template when empty.
emptyGridTemplate: (ctx: IgrGridTemplateContext) => React.ReactNode excelStyleHeaderIconTemplate
Section titled "excelStyleHeaderIconTemplate"Gets the excel style header icon.
excelStyleHeaderIconTemplate: (ctx: IgrGridHeaderTemplateContext) => React.ReactNode expandChildren
Section titled "expandChildren"Sets if all immediate children of the grids for this RowIslandComponent should be expanded/collapsed.
expandChildren: boolean expansionStates
Section titled "expansionStates"Gets/Sets a list of key-value pairs [row ID, expansion state].
expansionStates: Map<any, boolean> filteringExpressionsTree
Section titled "filteringExpressionsTree"Gets/Sets the filtering state.
filteringExpressionsTree: IgrFilteringExpressionsTree filteringLogic
Section titled "filteringLogic"Gets/Sets the filtering logic of the GridComponent.
filteringLogic: FilteringLogic filterMode
Section titled "filterMode"Gets/Sets the filter mode.
filterMode: FilterMode filterStrategy
Section titled "filterStrategy"Gets/Sets the filtering strategy of the grid.
filterStrategy: IgrFilteringStrategy hasChildrenKey
Section titled "hasChildrenKey"Gets/Sets the key indicating whether a row has children. If row has no children it does not render an expand indicator.
hasChildrenKey: string headerCollapsedIndicatorTemplate
Section titled "headerCollapsedIndicatorTemplate"Gets the row collapse indicator template.
headerCollapsedIndicatorTemplate: (ctx: IgrGridTemplateContext) => React.ReactNode headerExpandedIndicatorTemplate
Section titled "headerExpandedIndicatorTemplate"Gets the header expand indicator template.
headerExpandedIndicatorTemplate: (ctx: IgrGridTemplateContext) => React.ReactNode headSelectorTemplate
Section titled "headSelectorTemplate"Gets the header row selector template.
headSelectorTemplate: (ctx: IgrHeadSelectorTemplateContext) => React.ReactNode height
Section titled "height"Gets/Sets the height.
height: string hideRowSelectors
Section titled "hideRowSelectors"Gets/Sets if the row selectors are hidden.
hideRowSelectors: boolean isLoading
Section titled "isLoading"Gets/Sets whether the grid is going to show a loading indicator.
isLoading: boolean loadingGridTemplate
Section titled "loadingGridTemplate"Gets/Sets a custom template when loading.
loadingGridTemplate: (ctx: IgrGridTemplateContext) => React.ReactNode locale
Section titled "locale"Gets/Sets the locale.
locale: string mergeStrategy
Section titled "mergeStrategy"Gets/Sets the merge strategy of the grid.
mergeStrategy: IgrGridMergeStrategy moving
Section titled "moving"Controls whether columns moving is enabled in the grid.
moving: boolean paginationComponents
Section titled "paginationComponents"paginationComponents: IgrPaginatorComponent[] paginatorTemplate
Section titled "paginatorTemplate"Sets/Gets the paginator template for each child grid created from this row island.
paginatorTemplate: (ctx: IgrGridPaginatorTemplateContext) => React.ReactNode pagingMode
Section titled "pagingMode"pagingMode: GridPagingMode pinning
Section titled "pinning"Gets/Sets the initial pinning configuration.
pinning: IgrPinningConfig primaryKey
Section titled "primaryKey"Gets/Sets the primary key.
primaryKey: string resourceStrings
Section titled "resourceStrings"Gets/Sets the resource strings.
resourceStrings: IgrGridResourceStrings rowAddTextTemplate
Section titled "rowAddTextTemplate"Gets the row add text template.
rowAddTextTemplate: (ctx: IgrGridEmptyTemplateContext) => React.ReactNode rowClasses
Section titled "rowClasses"Sets a conditional class selector to the grid's row element. Accepts an object literal, containing key-value pairs, where the key is the name of the CSS class and the value is either a callback function that returns a boolean, or boolean, like so:
rowClasses: any rowCollapsedIndicatorTemplate
Section titled "rowCollapsedIndicatorTemplate"Gets the row collapse indicator template.
rowCollapsedIndicatorTemplate: (ctx: IgrGridRowTemplateContext) => React.ReactNode rowDraggable
Section titled "rowDraggable"Gets/Sets whether rows can be moved.
rowDraggable: boolean rowEditable
Section titled "rowEditable"Gets/Sets whether the rows are editable.
rowEditable: boolean rowEditActionsTemplate
Section titled "rowEditActionsTemplate"Gets the row edit actions template.
rowEditActionsTemplate: (ctx: IgrGridRowEditActionsTemplateContext) => React.ReactNode rowEditTextTemplate
Section titled "rowEditTextTemplate"Gets the row edit text template.
rowEditTextTemplate: (ctx: IgrGridRowEditTextTemplateContext) => React.ReactNode rowExpandedIndicatorTemplate
Section titled "rowExpandedIndicatorTemplate"Gets the row expand indicator template.
rowExpandedIndicatorTemplate: (ctx: IgrGridRowTemplateContext) => React.ReactNode rowHeight
Section titled "rowHeight"Gets/Sets the row height.
rowHeight: number rowSelection
Section titled "rowSelection"Gets/Sets row selection mode
rowSelection: GridSelectionMode rowSelectorTemplate
Section titled "rowSelectorTemplate"Gets the row selector template.
rowSelectorTemplate: (ctx: IgrRowSelectorTemplateContext) => React.ReactNode rowStyles
Section titled "rowStyles"Sets conditional style properties on the grid row element. It accepts an object literal where the keys are the style properties and the value is an expression to be evaluated.
rowStyles: any selectedRows
Section titled "selectedRows"Gets/Sets the current selection state.
selectedRows: any[] selectRowOnClick
Section titled "selectRowOnClick"Gets/Sets whether clicking over a row should select/deselect it
selectRowOnClick: boolean shouldGenerate
Section titled "shouldGenerate"Gets/Sets whether the columns should be auto-generated once again after the initialization of the grid
shouldGenerate: boolean showExpandAll
Section titled "showExpandAll"Gets/Sets whether the expand/collapse all button in the header should be rendered.
showExpandAll: boolean showSummaryOnCollapse
Section titled "showSummaryOnCollapse"Controls whether the summary row is visible when groupBy/parent row is collapsed.
showSummaryOnCollapse: boolean snackbarDisplayTime
Section titled "snackbarDisplayTime"Gets/Sets the display time for the row adding snackbar notification.
snackbarDisplayTime: number sortAscendingHeaderIconTemplate
Section titled "sortAscendingHeaderIconTemplate"The custom template, if any, that should be used when rendering a header sorting indicator when columns are sorted in asc order.
sortAscendingHeaderIconTemplate: (ctx: IgrGridHeaderTemplateContext) => React.ReactNode sortDescendingHeaderIconTemplate
Section titled "sortDescendingHeaderIconTemplate"The custom template, if any, that should be used when rendering a header sorting indicator when columns are sorted in desc order.
sortDescendingHeaderIconTemplate: (ctx: IgrGridHeaderTemplateContext) => React.ReactNode sortHeaderIconTemplate
Section titled "sortHeaderIconTemplate"Gets custom template, if any, that should be used when rendering a header sorting indicator when columns are not sorted.
sortHeaderIconTemplate: (ctx: IgrGridHeaderTemplateContext) => React.ReactNode sortingExpressions
Section titled "sortingExpressions"Gets/Sets the sorting state.
sortingExpressions: IgrSortingExpression[] sortingOptions
Section titled "sortingOptions"Gets/Sets the sorting options - single or multiple sorting.
Accepts an ISortingOptions object with any of the mode properties.
sortingOptions: IgrSortingOptions sortStrategy
Section titled "sortStrategy"Gets/Sets the sorting strategy of the grid.
sortStrategy: IgrGridSortingStrategy summaryCalculationMode
Section titled "summaryCalculationMode"Gets/Sets the summary calculation mode.
summaryCalculationMode: GridSummaryCalculationMode summaryPosition
Section titled "summaryPosition"Gets/Sets the summary position.
summaryPosition: GridSummaryPosition summaryRowHeight
Section titled "summaryRowHeight"Get/Set SummaryRow height
summaryRowHeight: number toolbar
Section titled "toolbar"toolbar: IgrGridToolbarComponent[] toolbarTemplate
Section titled "toolbarTemplate"Sets/Gets the toolbar template for each child grid created from this row island.
toolbarTemplate: (ctx: IgrGridToolbarTemplateContext) => React.ReactNode totalRecords
Section titled "totalRecords"Returns the total number of records.
totalRecords: number validationTrigger
Section titled "validationTrigger"Gets/Sets the trigger for validators used when editing the grid.
validationTrigger: GridValidationTrigger width
Section titled "width"Gets/Sets the width of the grid.
width: string Accessors
Section titled "Accessors"columns
Section titled "columns"Gets an array of ColumnComponents.
get columns(): IgrColumnComponent[] Returns IgrColumnComponent[]
dataRowList
Section titled "dataRowList"A list of currently rendered GridRowComponent's.
get dataRowList(): IgrRowDirective[] Returns IgrRowDirective[]
defaultRowHeight
Section titled "defaultRowHeight"Gets the default row height.
get defaultRowHeight(): number Returns number
pinnedRows
Section titled "pinnedRows"Gets an array of the pinned RowComponents.
get pinnedRows(): IgrGridRowComponent[] Returns IgrGridRowComponent[]
rowList
Section titled "rowList"Methods
Section titled "Methods"addRow
Section titled "addRow"Creates a new GridRowComponent and adds the data record to the end of the data source.
addRow(data: any): void Parameters
- data:
any
Returns void
Example
this.grid1.addRow(record); beginAddRowById
Section titled "beginAddRowById"Enters add mode by spawning the UI under the specified row by rowID.
beginAddRowById(rowID: any, asChild: boolean): void Parameters
- rowID:
anyThe rowID to spawn the add row UI for, or null to spawn it as the first record in the data view
- asChild:
booleanWhether the record should be added as a child. Only applicable to igxTreeGrid.
Returns void
Example
this.grid.beginAddRowById('ALFKI');
this.grid.beginAddRowById('ALFKI', true);
this.grid.beginAddRowById(null); beginAddRowByIndex
Section titled "beginAddRowByIndex"Enters add mode by spawning the UI at the specified index.
beginAddRowByIndex(index: number): void Parameters
- index:
numberThe index to spawn the UI at. Accepts integers from 0 to this.grid.dataView.length
Returns void
Example
this.grid.beginAddRowByIndex(0); clearCellSelection
Section titled "clearCellSelection"Deselect selected cells.
clearCellSelection(): void Returns void
Example
this.grid.clearCellSelection(); clearFilter
Section titled "clearFilter"If name is provided, clears the filtering state of the corresponding ColumnComponent.
clearFilter(name: string): void Parameters
- name:
string
Returns void
Example
this.grid.clearFilter(); clearSearch
Section titled "clearSearch"Removes all the highlights in the cell.
clearSearch(): void Returns void
Example
this.grid.clearSearch(); clearSort
Section titled "clearSort"If name is provided, clears the sorting state of the corresponding ColumnComponent.
clearSort(name: string): void Parameters
- name:
string
Returns void
Example
this.grid.clearSort(); closeAdvancedFilteringDialog
Section titled "closeAdvancedFilteringDialog"Closes the advanced filtering dialog.
closeAdvancedFilteringDialog(applyChanges: boolean): void Parameters
- applyChanges:
booleanindicates whether the changes should be applied
Returns void
collapseAll
Section titled "collapseAll"Collapses all rows.
collapseAll(): void Returns void
Example
this.grid.collapseAll(); collapseRow
Section titled "collapseRow"Collapses the row by its id.
collapseRow(rowID: any): void Parameters
- rowID:
anyThe row id - primaryKey value or the data record instance.
Returns void
Example
this.grid.collapseRow(rowID); deleteRow
Section titled "deleteRow"Removes the GridRowComponent and the corresponding data record by primary key.
deleteRow(rowSelector: any): any Parameters
- rowSelector:
any
Returns any
Example
this.grid1.deleteRow(0); deselectAllColumns
Section titled "deselectAllColumns"Deselects all columns
deselectAllColumns(): void Returns void
Example
this.grid.deselectAllColumns(); deselectAllRows
Section titled "deselectAllRows"Deselects all rows
deselectAllRows(onlyFilterData: boolean): void Parameters
- onlyFilterData:
boolean
Returns void
Example
this.grid.deselectAllRows(); deselectColumns
Section titled "deselectColumns"Deselect specified columns by field.
deselectColumns(columns: string[] | IgrColumnComponent[]): void Parameters
- columns:
string[] | IgrColumnComponent[]
Returns void
Example
this.grid.deselectColumns(['ID','Name']); deselectRows
Section titled "deselectRows"Deselect specified rows by ID.
deselectRows(rowIDs: any[]): void Parameters
- rowIDs:
any[]
Returns void
Example
this.grid.deselectRows([1,2,5]); disableSummaries
Section titled "disableSummaries"Disable summaries for the specified column.
disableSummaries(rest: any[]): void Parameters
- rest:
any[]
Returns void
Example
grid.disableSummaries('ProductName'); enableSummaries
Section titled "enableSummaries"Enables summaries for the specified column and applies your customSummary.
enableSummaries(rest: any[]): void Parameters
- rest:
any[]
Returns void
Example
grid.enableSummaries([{ fieldName: 'ProductName' }, { fieldName: 'ID' }]);Enable summaries for the listed columns.
endEdit
Section titled "endEdit"Finishes the row transactions on the current row and returns whether the grid editing was canceled.
endEdit(commit: boolean, evt: any): boolean Parameters
- commit:
boolean - evt:
any
Returns boolean
expandAll
Section titled "expandAll"Expands all rows.
expandAll(): void Returns void
Example
this.grid.expandAll(); expandRow
Section titled "expandRow"Expands the row by its id.
expandRow(rowID: any): void Parameters
- rowID:
anyThe row id - primaryKey value or the data record instance.
Returns void
Example
this.grid.expandRow(rowID); filter
Section titled "filter"Filters a single ColumnComponent.
filter(name: string, value: any, conditionOrExpressionTree: IgrFilteringExpressionsTree | IgrFilteringOperation, ignoreCase: boolean): void Parameters
- name:
string - value:
any - conditionOrExpressionTree:
IgrFilteringExpressionsTree | IgrFilteringOperation - ignoreCase:
boolean
Returns void
filterGlobal
Section titled "filterGlobal"Filters all the ColumnComponent in the GridComponent with the same condition.
filterGlobal(value: any, condition: any, ignoreCase: any): void Parameters
- value:
any - condition:
any - ignoreCase:
any
Returns void
findNext
Section titled "findNext"Finds the next occurrence of a given string in the grid and scrolls to the cell if it isn't visible.
findNext(text: string, caseSensitive: boolean, exactMatch: boolean): number Parameters
- text:
stringthe string to search.
- caseSensitive:
booleanoptionally, if the search should be case sensitive (defaults to false).
- exactMatch:
booleanoptionally, if the text should match the entire value (defaults to false).
Returns number
Example
this.grid.findNext("financial"); findPrev
Section titled "findPrev"Finds the previous occurrence of a given string in the grid and scrolls to the cell if it isn't visible.
findPrev(text: string, caseSensitive: boolean, exactMatch: boolean): number Parameters
- text:
stringthe string to search.
- caseSensitive:
booleanoptionally, if the search should be case sensitive (defaults to false).
- exactMatch:
booleanoptionally, if the text should match the entire value (defaults to false).
Returns number
Example
this.grid.findPrev("financial"); getColumnByName
Section titled "getColumnByName"Returns the ColumnComponent by field name.
getColumnByName(name: string): IgrColumnComponent Parameters
- name:
string
Returns IgrColumnComponent
Example
const myCol = this.grid1.getColumnByName("ID"); getColumnByVisibleIndex
Section titled "getColumnByVisibleIndex"getColumnByVisibleIndex(index: number): IgrColumnComponent Parameters
- index:
number
Returns IgrColumnComponent
getHeaderGroupWidth
Section titled "getHeaderGroupWidth"Gets the width to be set on GridHeaderGroupComponent.
getHeaderGroupWidth(column: IgrColumnComponent): string Parameters
- column:
IgrColumnComponent
Returns string
getNextCell
Section titled "getNextCell"Returns ICellPosition which defines the next cell,
according to the current position, that match specific criteria.
getNextCell(currRowIndex: number, curVisibleColIndex: number, callback: any): IgrCellPosition Parameters
- currRowIndex:
number - curVisibleColIndex:
number - callback:
any
Returns IgrCellPosition
Example
const nextEditableCellPosition = this.grid.getNextCell(0, 3, (column) => column.editable); getPinnedEndWidth
Section titled "getPinnedEndWidth"Gets calculated width of the pinned areas.
getPinnedEndWidth(takeHidden: boolean): void Parameters
- takeHidden:
booleanIf we should take into account the hidden columns in the pinned area.
Returns void
Example
const pinnedWidth = this.grid.getPinnedEndWidth(); getPinnedStartWidth
Section titled "getPinnedStartWidth"Gets calculated width of the pinned areas.
getPinnedStartWidth(takeHidden: boolean): void Parameters
- takeHidden:
booleanIf we should take into account the hidden columns in the pinned area.
Returns void
Example
const pinnedWidth = this.grid.getPinnedStartWidth(); getPreviousCell
Section titled "getPreviousCell"Returns ICellPosition which defines the previous cell,
according to the current position, that match specific criteria.
getPreviousCell(currRowIndex: number, curVisibleColIndex: number, callback: any): IgrCellPosition Parameters
- currRowIndex:
number - curVisibleColIndex:
number - callback:
any
Returns IgrCellPosition
Example
const previousEditableCellPosition = this.grid.getPreviousCell(0, 3, (column) => column.editable); getRowData
Section titled "getRowData"Returns the data that is contained in the row component.
getRowData(rowSelector: any): any Parameters
- rowSelector:
anycorrespond to rowID
Returns any
Example
const data = grid.getRowData(94741); getSelectedColumnsData
Section titled "getSelectedColumnsData"Returns an array of the current columns selection in the form of [{ column.field: cell.value }, ...].
getSelectedColumnsData(formatters: boolean, headers: boolean): void Parameters
- formatters:
boolean - headers:
boolean
Returns void
getSelectedData
Section titled "getSelectedData"Returns an array of the current cell selection in the form of [{ column.field: cell.value }, ...].
getSelectedData(formatters: boolean, headers: boolean): void Parameters
- formatters:
boolean - headers:
boolean
Returns void
getSelectedRanges
Section titled "getSelectedRanges"Get the currently selected ranges in the grid.
getSelectedRanges(): IgrGridSelectionRange[] Returns IgrGridSelectionRange[]
isRecordPinnedByIndex
Section titled "isRecordPinnedByIndex"Returns whether the record is pinned or not.
isRecordPinnedByIndex(rowIndex: number): void Parameters
- rowIndex:
numberIndex of the record in the
filteredSortedDatacollection.
Returns void
markForCheck
Section titled "markForCheck"Triggers change detection for the GridComponent.
Calling markForCheck also triggers the grid pipes explicitly, resulting in all updates being processed.
May degrade performance if used when not needed, or if misused:
``
markForCheck(): void Returns void
Example
grid.markForCheck(); moveColumn
Section titled "moveColumn"Places a column before or after the specified target column.
moveColumn(column: IgrColumnComponent, target: IgrColumnComponent, pos: DropPosition): void Parameters
- column:
IgrColumnComponent - target:
IgrColumnComponent - pos:
DropPosition
Returns void
Example
grid.moveColumn(column, target); navigateTo
Section titled "navigateTo"Navigates to a position in the grid based on provided rowindex and visibleColumnIndex.
navigateTo(rowIndex: number, visibleColIndex: number, cb: any): void Parameters
- rowIndex:
number - visibleColIndex:
number - cb:
any
Returns void
Example
this.grid.navigateTo(10, 3, (args) => { args.target.nativeElement.focus(); }); openAdvancedFilteringDialog
Section titled "openAdvancedFilteringDialog"Opens the advanced filtering dialog.
openAdvancedFilteringDialog(overlaySettings: IgrOverlaySettings): void Parameters
- overlaySettings:
IgrOverlaySettings
Returns void
pinColumn
Section titled "pinColumn"Pins a column by field name.
pinColumn(columnName: string, index: number, pinningPosition: ColumnPinningPosition): boolean Parameters
- columnName:
string - index:
number - pinningPosition:
ColumnPinningPosition
Returns boolean
Example
this.grid.pinColumn("ID"); pinRow
Section titled "pinRow"Pin the row by its id.
pinRow(rowID: any, index: number, row: IgrRowType): boolean Parameters
- rowID:
anyThe row id - primaryKey value or the data record instance.
- index:
numberThe index at which to insert the row in the pinned collection.
- row:
IgrRowType
Returns boolean
Example
this.grid.pinRow(rowID); recalculateAutoSizes
Section titled "recalculateAutoSizes"Recalculates all widths of columns that have size set to auto.
recalculateAutoSizes(): void Returns void
Example
this.grid1.recalculateAutoSizes(); refreshSearch
Section titled "refreshSearch"Reapplies the existing search.
refreshSearch(updateActiveInfo: boolean, endEdit: boolean): number Parameters
- updateActiveInfo:
boolean - endEdit:
boolean
Returns number
Example
this.grid.refreshSearch(); selectAllColumns
Section titled "selectAllColumns"Selects all columns
selectAllColumns(): void Returns void
Example
this.grid.deselectAllColumns(); selectAllRows
Section titled "selectAllRows"Selects all rows
selectAllRows(onlyFilterData: boolean): void Parameters
- onlyFilterData:
boolean
Returns void
Example
this.grid.selectAllRows();
this.grid.selectAllRows(false); selectColumns
Section titled "selectColumns"Select specified columns.
selectColumns(columns: string[] | IgrColumnComponent[], clearCurrentSelection: boolean): void Parameters
- columns:
string[] | IgrColumnComponent[] - clearCurrentSelection:
booleanif true clears the current selection
Returns void
Example
this.grid.selectColumns(['ID','Name'], true); selectedColumns
Section titled "selectedColumns"Get current selected columns.
selectedColumns(): IgrColumnComponent[] Returns IgrColumnComponent[]
Example
Returns an array with selected columns
const selectedColumns = this.grid.selectedColumns(); selectRange
Section titled "selectRange"Select range(s) of cells between certain rows and columns of the grid.
selectRange(arg: IgrGridSelectionRange[]): void Parameters
- arg:
IgrGridSelectionRange[]
Returns void
selectRows
Section titled "selectRows"Select specified rows by ID.
selectRows(rowIDs: any[], clearCurrentSelection: boolean): void Parameters
- rowIDs:
any[] - clearCurrentSelection:
booleanif true clears the current selection
Returns void
Example
this.grid.selectRows([1,2,5], true); Sort a single ColumnComponent.
sort(expression: IgrSortingExpression[]): void Parameters
- expression:
IgrSortingExpression[]
Returns void
Example
this.grid.sort({ fieldName: name, dir: SortingDirection.Asc, ignoreCase: false }); toggleColumnVisibility
Section titled "toggleColumnVisibility"Toggles the specified column's visibility.
toggleColumnVisibility(args: IgrColumnVisibilityChangedEventArgs): void Parameters
Returns void
Example
this.grid1.toggleColumnVisibility({
column: this.grid1.columns[0],
newValue: true
}); toggleRow
Section titled "toggleRow"Toggles the row by its id.
toggleRow(rowID: any): void Parameters
- rowID:
anyThe row id - primaryKey value or the data record instance.
Returns void
Example
this.grid.toggleRow(rowID); unpinColumn
Section titled "unpinColumn"Unpins a column by field name. Returns whether the operation is successful.
unpinColumn(columnName: string, index: number): boolean Parameters
- columnName:
string - index:
number
Returns boolean
Example
this.grid.pinColumn("ID"); unpinRow
Section titled "unpinRow"Unpin the row by its id.
unpinRow(rowID: any, row: IgrRowType): boolean Parameters
- rowID:
anyThe row id - primaryKey value or the data record instance.
- row:
IgrRowType
Returns boolean
Example
this.grid.unpinRow(rowID); updateCell
Section titled "updateCell"Updates the GridRowComponent and the corresponding data record by primary key.
updateCell(value: any, rowSelector: any, column: string): void Parameters
- value:
anythe new value which is to be set.
- rowSelector:
anycorresponds to rowID.
- column:
stringcorresponds to column field.
Returns void
Example
this.gridWithPK.updateCell('Updated', 1, 'ProductName'); updateRow
Section titled "updateRow"Updates the GridRowComponent
updateRow(value: any, rowSelector: any): void Parameters
- value:
any - rowSelector:
anycorrespond to rowID
Returns void
Example
grid.updateRow({
ProductID: 1, ProductName: 'Spearmint', InStock: true, UnitsInStock: 1, OrderDate: new Date('2005-03-21')
}, 1); Events
Section titled "Events"onActiveNodeChange
Section titled "onActiveNodeChange"onActiveNodeChange(args: CustomEvent<IgrActiveNodeChangeEventArgs>): void Parameters
Returns void
onAdvancedFilteringExpressionsTreeChange
Section titled "onAdvancedFilteringExpressionsTreeChange"onAdvancedFilteringExpressionsTreeChange(args: CustomEvent<IgrFilteringExpressionsTree>): void Parameters
Returns void
onCellClick
Section titled "onCellClick"onCellClick(args: CustomEvent<IgrGridCellEventArgs>): void Parameters
- args:
CustomEvent<IgrGridCellEventArgs>
Returns void
onCellEdit
Section titled "onCellEdit"onCellEdit(args: CustomEvent<IgrGridEditEventArgs>): void Parameters
- args:
CustomEvent<IgrGridEditEventArgs>
Returns void
onCellEditDone
Section titled "onCellEditDone"onCellEditDone(args: CustomEvent<IgrGridEditDoneEventArgs>): void Parameters
Returns void
onCellEditEnter
Section titled "onCellEditEnter"onCellEditEnter(args: CustomEvent<IgrGridEditEventArgs>): void Parameters
- args:
CustomEvent<IgrGridEditEventArgs>
Returns void
onCellEditExit
Section titled "onCellEditExit"onCellEditExit(args: CustomEvent<IgrGridEditDoneEventArgs>): void Parameters
Returns void
onColumnInit
Section titled "onColumnInit"onColumnInit(args: CustomEvent<IgrColumnComponent>): void Parameters
- args:
CustomEvent<IgrColumnComponent>
Returns void
onColumnMoving
Section titled "onColumnMoving"onColumnMoving(args: CustomEvent<IgrColumnMovingEventArgs>): void Parameters
Returns void
onColumnMovingEnd
Section titled "onColumnMovingEnd"onColumnMovingEnd(args: CustomEvent<IgrColumnMovingEndEventArgs>): void Parameters
Returns void
onColumnMovingStart
Section titled "onColumnMovingStart"onColumnMovingStart(args: CustomEvent<IgrColumnMovingStartEventArgs>): void Parameters
Returns void
onColumnPin
Section titled "onColumnPin"onColumnPin(args: CustomEvent<IgrPinColumnCancellableEventArgs>): void Parameters
Returns void
onColumnPinned
Section titled "onColumnPinned"onColumnPinned(args: CustomEvent<IgrPinColumnEventArgs>): void Parameters
- args:
CustomEvent<IgrPinColumnEventArgs>
Returns void
onColumnResized
Section titled "onColumnResized"onColumnResized(args: CustomEvent<IgrColumnResizeEventArgs>): void Parameters
Returns void
onColumnsAutogenerated
Section titled "onColumnsAutogenerated"onColumnsAutogenerated(args: CustomEvent<IgrColumnsAutoGeneratedEventArgs>): void Parameters
Returns void
onColumnSelectionChanging
Section titled "onColumnSelectionChanging"onColumnSelectionChanging(args: CustomEvent<IgrColumnSelectionEventArgs>): void Parameters
Returns void
onColumnVisibilityChanged
Section titled "onColumnVisibilityChanged"onColumnVisibilityChanged(args: CustomEvent<IgrColumnVisibilityChangedEventArgs>): void Parameters
Returns void
onColumnVisibilityChanging
Section titled "onColumnVisibilityChanging"onColumnVisibilityChanging(args: CustomEvent<IgrColumnVisibilityChangingEventArgs>): void Parameters
Returns void
onContextMenu
Section titled "onContextMenu"onContextMenu(args: CustomEvent<IgrGridContextMenuEventArgs>): void Parameters
Returns void
onDataChanged
Section titled "onDataChanged"onDataChanged(args: CustomEvent<IgrForOfDataChangeEventArgs>): void Parameters
Returns void
onDataChanging
Section titled "onDataChanging"onDataChanging(args: CustomEvent<IgrForOfDataChangeEventArgs>): void Parameters
Returns void
onDataPreLoad
Section titled "onDataPreLoad"onDataPreLoad(args: CustomEvent<IgrForOfState>): void Parameters
- args:
CustomEvent<IgrForOfState>
Returns void
onDoubleClick
Section titled "onDoubleClick"onDoubleClick(args: CustomEvent<IgrGridCellEventArgs>): void Parameters
- args:
CustomEvent<IgrGridCellEventArgs>
Returns void
onExpansionStatesChange
Section titled "onExpansionStatesChange"onExpansionStatesChange(args: CustomEvent<Map<any, boolean>>): void Parameters
- args:
CustomEvent<Map<any, boolean>>
Returns void
onFiltering
Section titled "onFiltering"onFiltering(args: CustomEvent<IgrFilteringEventArgs>): void Parameters
- args:
CustomEvent<IgrFilteringEventArgs>
Returns void
onFilteringDone
Section titled "onFilteringDone"onFilteringDone(args: CustomEvent<IgrFilteringExpressionsTree>): void Parameters
Returns void
onFilteringExpressionsTreeChange
Section titled "onFilteringExpressionsTreeChange"onFilteringExpressionsTreeChange(args: CustomEvent<IgrFilteringExpressionsTree>): void Parameters
Returns void
onFormGroupCreated
Section titled "onFormGroupCreated"onFormGroupCreated(args: CustomEvent<IgrGridFormGroupCreatedEventArgs>): void Parameters
Returns void
onGridCopy
Section titled "onGridCopy"onGridCopy(args: CustomEvent<IgrGridClipboardEvent>): void Parameters
- args:
CustomEvent<IgrGridClipboardEvent>
Returns void
onGridCreated
Section titled "onGridCreated"onGridCreated(args: CustomEvent<IgrGridCreatedEventArgs>): void Parameters
Returns void
onGridInitialized
Section titled "onGridInitialized"onGridInitialized(args: CustomEvent<IgrGridCreatedEventArgs>): void Parameters
Returns void
onGridKeydown
Section titled "onGridKeydown"onGridKeydown(args: CustomEvent<IgrGridKeydownEventArgs>): void Parameters
Returns void
onGridScroll
Section titled "onGridScroll"onGridScroll(args: CustomEvent<IgrGridScrollEventArgs>): void Parameters
Returns void
onRangeSelected
Section titled "onRangeSelected"onRangeSelected(args: CustomEvent<IgrGridSelectionRange>): void Parameters
- args:
CustomEvent<IgrGridSelectionRange>
Returns void
onRendered
Section titled "onRendered"onRendered(args: CustomEvent<boolean>): void Parameters
- args:
CustomEvent<boolean>
Returns void
onRowAdd
Section titled "onRowAdd"onRowAdd(args: CustomEvent<IgrRowDataCancelableEventArgs>): void Parameters
Returns void
onRowAdded
Section titled "onRowAdded"onRowAdded(args: CustomEvent<IgrRowDataEventArgs>): void Parameters
- args:
CustomEvent<IgrRowDataEventArgs>
Returns void
onRowClick
Section titled "onRowClick"onRowClick(args: CustomEvent<IgrGridRowEventArgs>): void Parameters
- args:
CustomEvent<IgrGridRowEventArgs>
Returns void
onRowDelete
Section titled "onRowDelete"onRowDelete(args: CustomEvent<IgrRowDataCancelableEventArgs>): void Parameters
Returns void
onRowDeleted
Section titled "onRowDeleted"onRowDeleted(args: CustomEvent<IgrRowDataEventArgs>): void Parameters
- args:
CustomEvent<IgrRowDataEventArgs>
Returns void
onRowDragEnd
Section titled "onRowDragEnd"onRowDragEnd(args: CustomEvent<IgrRowDragEndEventArgs>): void Parameters
Returns void
onRowDragStart
Section titled "onRowDragStart"onRowDragStart(args: CustomEvent<IgrRowDragStartEventArgs>): void Parameters
Returns void
onRowEdit
Section titled "onRowEdit"onRowEdit(args: CustomEvent<IgrGridEditEventArgs>): void Parameters
- args:
CustomEvent<IgrGridEditEventArgs>
Returns void
onRowEditDone
Section titled "onRowEditDone"onRowEditDone(args: CustomEvent<IgrGridEditDoneEventArgs>): void Parameters
Returns void
onRowEditEnter
Section titled "onRowEditEnter"onRowEditEnter(args: CustomEvent<IgrGridEditEventArgs>): void Parameters
- args:
CustomEvent<IgrGridEditEventArgs>
Returns void
onRowEditExit
Section titled "onRowEditExit"onRowEditExit(args: CustomEvent<IgrGridEditDoneEventArgs>): void Parameters
Returns void
onRowPinned
Section titled "onRowPinned"onRowPinned(args: CustomEvent<IgrPinRowEventArgs>): void Parameters
- args:
CustomEvent<IgrPinRowEventArgs>
Returns void
onRowPinning
Section titled "onRowPinning"onRowPinning(args: CustomEvent<IgrPinRowEventArgs>): void Parameters
- args:
CustomEvent<IgrPinRowEventArgs>
Returns void
onRowSelectionChanging
Section titled "onRowSelectionChanging"onRowSelectionChanging(args: CustomEvent<IgrRowSelectionEventArgs>): void Parameters
Returns void
onRowToggle
Section titled "onRowToggle"onRowToggle(args: CustomEvent<IgrRowToggleEventArgs>): void Parameters
- args:
CustomEvent<IgrRowToggleEventArgs>
Returns void
onSelected
Section titled "onSelected"onSelected(args: CustomEvent<IgrGridCellEventArgs>): void Parameters
- args:
CustomEvent<IgrGridCellEventArgs>
Returns void
onSelectedRowsChange
Section titled "onSelectedRowsChange"onSelectedRowsChange(args: CustomEvent<any[]>): void Parameters
- args:
CustomEvent<any[]>
Returns void
onSorting
Section titled "onSorting"onSorting(args: CustomEvent<IgrSortingEventArgs>): void Parameters
- args:
CustomEvent<IgrSortingEventArgs>
Returns void
onSortingDone
Section titled "onSortingDone"onSortingDone(args: CustomEvent<IgrSortingExpression[]>): void Parameters
- args:
CustomEvent<IgrSortingExpression[]>
Returns void
onSortingExpressionsChange
Section titled "onSortingExpressionsChange"onSortingExpressionsChange(args: CustomEvent<IgrSortingExpression[]>): void Parameters
- args:
CustomEvent<IgrSortingExpression[]>
Returns void
onToolbarExporting
Section titled "onToolbarExporting"onToolbarExporting(args: CustomEvent<IgrGridToolbarExportEventArgs>): void Parameters
Returns void
onValidationStatusChange
Section titled "onValidationStatusChange"onValidationStatusChange(args: CustomEvent<IgrGridValidationStatusEventArgs>): void