Ignite UI for React

All
  • Public
  • Public/Protected
  • All

Interface IIgrGridBaseDirectiveProps

Hierarchy

Hierarchy

Properties

Properties

Optional activeNodeChange

activeNodeChange?: ((s, e) => void)

Type declaration

Optional addRowEmptyTemplate

addRowEmptyTemplate?: FunctionComponent<{
    dataContext: any;
}> | Component<{
    dataContext: any;
}, {}, any>

Optional advancedFilteringExpressionsTree

advancedFilteringExpressionsTree?: IgrFilteringExpressionsTree

Gets/Sets the advanced filtering state.

Example

let advancedFilteringExpressionsTree = this.grid.advancedFilteringExpressionsTree;
this.grid.advancedFilteringExpressionsTree = logic;

Optional advancedFilteringExpressionsTreeChange

advancedFilteringExpressionsTreeChange?: ((s, e) => void)

Type declaration

Optional allowAdvancedFiltering

allowAdvancedFiltering?: string | boolean

Optional allowFiltering

allowFiltering?: string | boolean

Optional autoGenerate

autoGenerate?: string | boolean

Optional autoGenerateExclude

autoGenerateExclude?: string[]

Optional batchEditing

batchEditing?: string | boolean

Optional cellClick

cellClick?: ((s, e) => void)

Type declaration

Optional cellEdit

cellEdit?: ((s, e) => void)

Type declaration

Optional cellEditDone

cellEditDone?: ((s, e) => void)

Type declaration

Optional cellEditEnter

cellEditEnter?: ((s, e) => void)

Type declaration

Optional cellEditExit

cellEditExit?: ((s, e) => void)

Type declaration

Optional cellSelection

cellSelection?: string | GridSelectionMode

Gets/Sets cell selection mode.

Remarks

By default the cell selection mode is multiple selectionMode: GridSelectionMode

Optional children

children?: ReactNode

Optional className

className?: string

Optional clipboardOptions

clipboardOptions?: IgrClipboardOptions

Controls the copy behavior of the grid.

Optional columnInit

columnInit?: ((s, e) => void)

Type declaration

Optional columnMoving

columnMoving?: ((s, e) => void)

Type declaration

Optional columnMovingEnd

columnMovingEnd?: ((s, e) => void)

Type declaration

Optional columnMovingStart

columnMovingStart?: ((s, e) => void)

Type declaration

Optional columnPin

columnPin?: ((s, e) => void)

Type declaration

Optional columnPinned

columnPinned?: ((s, e) => void)

Type declaration

    • (s, e): void

    • Emitted after IgxColumnComponent is pinned.

      Remarks

      The index that the column is inserted at may be changed through the insertAtIndex property.

      Example

      public columnPinning(event) {
      if (event.column.field === "Name") {
      event.insertAtIndex = 0;
      }
      }

      Parameters

      Returns void

Optional columnResized

columnResized?: ((s, e) => void)

Type declaration

Optional columnSelection

columnSelection?: string | GridSelectionMode

Gets/Sets column selection mode

Remarks

By default the row selection mode is none selectionMode: GridSelectionMode

Optional columnSelectionChanging

columnSelectionChanging?: ((s, e) => void)

Type declaration

Optional columnVisibilityChanged

columnVisibilityChanged?: ((s, e) => void)

Type declaration

Optional columnVisibilityChanging

columnVisibilityChanging?: ((s, e) => void)

Type declaration

Optional columnWidth

columnWidth?: string

Optional contextMenu

contextMenu?: ((s, e) => void)

Type declaration

Optional dataChanged

dataChanged?: ((s, e) => void)

Type declaration

Optional dataChanging

dataChanging?: ((s, e) => void)

Type declaration

Optional dataCloneStrategy

dataCloneStrategy?: IgrDataCloneStrategy

Optional doubleClick

doubleClick?: ((s, e) => void)

Type declaration

Optional dragGhostCustomTemplate

dragGhostCustomTemplate?: FunctionComponent<{
    dataContext: IgrGridRowDragGhostContext;
}> | Component<{
    dataContext: IgrGridRowDragGhostContext;
}, {}, any>

Gets the custom template, if any, used for row drag ghost.

Optional dragIndicatorIconTemplate

dragIndicatorIconTemplate?: FunctionComponent<{
    dataContext: IgrGridEmptyTemplateContext;
}> | Component<{
    dataContext: IgrGridEmptyTemplateContext;
}, {}, any>

The custom template, if any, that should be used when rendering the row drag indicator icon

Optional emptyFilteredGridMessage

emptyFilteredGridMessage?: string

Optional emptyGridMessage

emptyGridMessage?: string

Optional emptyGridTemplate

emptyGridTemplate?: FunctionComponent<{
    dataContext: any;
}> | Component<{
    dataContext: any;
}, {}, any>

Optional excelStyleHeaderIconTemplate

excelStyleHeaderIconTemplate?: FunctionComponent<{
    dataContext: IgrGridHeaderTemplateContext;
}> | Component<{
    dataContext: IgrGridHeaderTemplateContext;
}, {}, any>

Gets the excel style header icon.

Optional filterMode

filterMode?: string | FilterMode

Optional filterStrategy

filterStrategy?: IgrFilteringStrategy

Optional filtering

filtering?: ((s, e) => void)

Type declaration

Optional filteringDone

filteringDone?: ((s, e) => void)

Type declaration

Optional filteringExpressionsTree

filteringExpressionsTree?: IgrFilteringExpressionsTree

Optional filteringExpressionsTreeChange

filteringExpressionsTreeChange?: ((s, e) => void)

Type declaration

Optional filteringLogic

filteringLogic?: string | FilteringLogic

Optional formGroupCreated

formGroupCreated?: ((s, e) => void)

Type declaration

Optional gridCopy

gridCopy?: ((s, e) => void)

Type declaration

Optional gridKeydown

gridKeydown?: ((s, e) => void)

Type declaration

Optional gridScroll

gridScroll?: ((s, e) => void)

Type declaration

Optional headSelectorTemplate

headSelectorTemplate?: FunctionComponent<{
    dataContext: IgrHeadSelectorTemplateContext;
}> | Component<{
    dataContext: IgrHeadSelectorTemplateContext;
}, {}, any>

Gets the header row selector template.

Optional headerCollapsedIndicatorTemplate

headerCollapsedIndicatorTemplate?: FunctionComponent<{
    dataContext: IgrGridTemplateContext;
}> | Component<{
    dataContext: IgrGridTemplateContext;
}, {}, any>

Gets the row collapse indicator template.

Optional headerExpandedIndicatorTemplate

headerExpandedIndicatorTemplate?: FunctionComponent<{
    dataContext: IgrGridTemplateContext;
}> | Component<{
    dataContext: IgrGridTemplateContext;
}, {}, any>

Gets the header expand indicator template.

Optional height

height?: string

Optional hideRowSelectors

hideRowSelectors?: string | boolean

Gets/Sets if the row selectors are hidden.

Remarks

By default row selectors are shown

Optional id

id?: string

Optional isLoading

isLoading?: string | boolean

Optional loadingGridTemplate

loadingGridTemplate?: FunctionComponent<{
    dataContext: any;
}> | Component<{
    dataContext: any;
}, {}, any>

Optional locale

locale?: string

Gets/Sets the locale.

Remarks

If not set, returns browser's language.

Optional moving

moving?: string | boolean

Controls whether columns moving is enabled in the grid.

Optional outlet

outlet?: IgrOverlayOutletDirective

Gets/Sets the outlet used to attach the grid's overlays to.

Remark

If set, returns the outlet defined outside the grid. Otherwise returns the grid's internal outlet directive.

Optional pagingMode

pagingMode?: string | GridPagingMode

Optional pinning

pinning?: IgrPinningConfig

Optional primaryKey

primaryKey?: string

Optional rangeSelected

rangeSelected?: ((s, e) => void)

Type declaration

Optional rendered

rendered?: ((s, e) => void)

Type declaration

Optional resourceStrings

resourceStrings?: IgrGridResourceStrings

Gets/Sets the resource strings.

Remarks

By default it uses EN resources.

Optional rowAdd

rowAdd?: ((s, e) => void)

Type declaration

Optional rowAddTextTemplate

rowAddTextTemplate?: FunctionComponent<{
    dataContext: IgrGridEmptyTemplateContext;
}> | Component<{
    dataContext: IgrGridEmptyTemplateContext;
}, {}, any>

Gets the row add text template.

Optional rowAdded

rowAdded?: ((s, e) => void)

Type declaration

Optional rowClasses

rowClasses?: any

Optional rowClick

rowClick?: ((s, e) => void)

Type declaration

Optional rowCollapsedIndicatorTemplate

rowCollapsedIndicatorTemplate?: FunctionComponent<{
    dataContext: IgrGridRowTemplateContext;
}> | Component<{
    dataContext: IgrGridRowTemplateContext;
}, {}, any>

Gets the row collapse indicator template.

Optional rowDelete

rowDelete?: ((s, e) => void)

Type declaration

Optional rowDeleted

rowDeleted?: ((s, e) => void)

Type declaration

Optional rowDragEnd

rowDragEnd?: ((s, e) => void)

Type declaration

Optional rowDragStart

rowDragStart?: ((s, e) => void)

Type declaration

Optional rowDraggable

rowDraggable?: string | boolean

Optional rowEdit

rowEdit?: ((s, e) => void)

Type declaration

Optional rowEditActionsTemplate

rowEditActionsTemplate?: FunctionComponent<{
    dataContext: IgrGridRowEditActionsTemplateContext;
}> | Component<{
    dataContext: IgrGridRowEditActionsTemplateContext;
}, {}, any>

Gets the row edit actions template.

Optional rowEditDone

rowEditDone?: ((s, e) => void)

Type declaration

Optional rowEditEnter

rowEditEnter?: ((s, e) => void)

Type declaration

Optional rowEditExit

rowEditExit?: ((s, e) => void)

Type declaration

Optional rowEditTextTemplate

rowEditTextTemplate?: FunctionComponent<{
    dataContext: IgrGridRowEditTextTemplateContext;
}> | Component<{
    dataContext: IgrGridRowEditTextTemplateContext;
}, {}, any>

Gets the row edit text template.

Optional rowEditable

rowEditable?: string | boolean

Optional rowExpandedIndicatorTemplate

rowExpandedIndicatorTemplate?: FunctionComponent<{
    dataContext: IgrGridRowTemplateContext;
}> | Component<{
    dataContext: IgrGridRowTemplateContext;
}, {}, any>

Gets the row expand indicator template.

Optional rowHeight

rowHeight?: string | number

Optional rowPinned

rowPinned?: ((s, e) => void)

Type declaration

Optional rowPinning

rowPinning?: ((s, e) => void)

Type declaration

Optional rowSelection

rowSelection?: string | GridSelectionMode

Gets/Sets row selection mode

Remarks

By default the row selection mode is 'none' Note that in IgxGrid and IgxHierarchicalGrid 'multipleCascade' behaves like 'multiple'

Optional rowSelectionChanging

rowSelectionChanging?: ((s, e) => void)

Type declaration

Optional rowSelectorTemplate

rowSelectorTemplate?: FunctionComponent<{
    dataContext: IgrRowSelectorTemplateContext;
}> | Component<{
    dataContext: IgrRowSelectorTemplateContext;
}, {}, any>

Gets the row selector template.

Optional rowStyles

rowStyles?: any

Optional rowToggle

rowToggle?: ((s, e) => void)

Type declaration

Optional selectRowOnClick

selectRowOnClick?: string | boolean

Gets/Sets whether clicking over a row should select/deselect it

Remarks

By default it is set to true enabled: boolean

Optional selected

selected?: ((s, e) => void)

Type declaration

Optional selectedRows

selectedRows?: any[]

Optional shouldGenerate

shouldGenerate?: string | boolean

Gets/Sets whether the columns should be auto-generated once again after the initialization of the grid

Remarks

This will allow to bind the grid to remote data and having auto-generated columns at the same time. Note that after generating the columns, this property would be disabled to avoid re-creating columns each time a new data is assigned.

Example

this.grid.shouldGenerate = true;

Optional showSummaryOnCollapse

showSummaryOnCollapse?: string | boolean

Optional snackbarDisplayTime

snackbarDisplayTime?: string | number

Gets/Sets the display time for the row adding snackbar notification.

Remarks

By default it is 6000ms.

Optional sortAscendingHeaderIconTemplate

sortAscendingHeaderIconTemplate?: FunctionComponent<{
    dataContext: IgrGridHeaderTemplateContext;
}> | Component<{
    dataContext: IgrGridHeaderTemplateContext;
}, {}, any>

The custom template, if any, that should be used when rendering a header sorting indicator when columns are sorted in asc order.

Optional sortDescendingHeaderIconTemplate

sortDescendingHeaderIconTemplate?: FunctionComponent<{
    dataContext: IgrGridHeaderTemplateContext;
}> | Component<{
    dataContext: IgrGridHeaderTemplateContext;
}, {}, any>

The custom template, if any, that should be used when rendering a header sorting indicator when columns are sorted in desc order.

Optional sortHeaderIconTemplate

sortHeaderIconTemplate?: FunctionComponent<{
    dataContext: IgrGridHeaderTemplateContext;
}> | Component<{
    dataContext: IgrGridHeaderTemplateContext;
}, {}, any>

Gets custom template, if any, that should be used when rendering a header sorting indicator when columns are not sorted.

Optional sortStrategy

sortStrategy?: IgrGridSortingStrategy

Optional sorting

sorting?: ((s, e) => void)

Type declaration

Optional sortingDone

sortingDone?: ((s, e) => void)

Type declaration

Optional sortingExpressions

sortingExpressions?: IgrSortingExpression[]

Optional sortingExpressionsChange

sortingExpressionsChange?: ((s, e) => void)

Type declaration

Optional sortingOptions

sortingOptions?: IgrSortingOptions

Optional style

style?: CSSProperties

Optional summaryCalculationMode

summaryCalculationMode?: string | GridSummaryCalculationMode

Optional summaryPosition

summaryPosition?: string | GridSummaryPosition

Optional summaryRowHeight

summaryRowHeight?: string | number

Get/Set IgxSummaryRow height

Optional toolbarExporting

toolbarExporting?: ((s, e) => void)

Type declaration

Optional totalRecords

totalRecords?: string | number

Returns the total number of records.

Remarks

Only functions when paging is enabled.

Example

const totalRecords = this.grid.totalRecords;

Optional validationStatusChange

validationStatusChange?: ((s, e) => void)

Type declaration

Optional validationTrigger

validationTrigger?: string | GridValidationTrigger

Optional width

width?: string

Gets/Sets the width of the grid.

Example

let gridWidth = this.grid.width;