Version 1
React Interface IDataViewProps GrapeCity DataViewsJS Interface

IDataViewProps Interface

Defines properties of DataViewComponent


  • IDataViewProps


Optional autoFocus

autoFocus: boolean

Auto focus DOM container on mount.

Optional className

className: string

Specifies CSS class name of the DOM container

Optional cols

cols: IColumn[]

Specifies an array of column definitions to initialize the grid

Optional config

config: any

Specifies a JSON object used to deserialize the grid from

Optional containerProps

containerProps: HTMLAttributes<HTMLDivElement>

Specifies other props of the DOM container


data: any

Specifies an array of objects for the grid model or a dataSource object

Optional groupingOptions

groupingOptions: any

Specifies options of grouping strategy.

Optional height

height: string | number

Specifies height of the DOM container

Optional id

id: string

Specifies ID of the DOM container

Optional layout

layout: ILayoutEngine

Specifies layout strategy. Default value is instance of GridLayout with default options

Optional onBeforeLoadRange

onBeforeLoadRange: EventHandler<IBeforeLoadRangeEventArgs>

This event occurs before loading next data range.

Optional onColumnChanged

onColumnChanged: EventHandler<IColumnChangedEventArgs>

This event occurs when the user changes the column visibility, pinned option, or column width, or expands or collapses the column group from UI

Optional onColumnReorder

onColumnReorder: EventHandler<IColumnReorderEventArgs>

This event occurs when the user starts dragging the column and before dropping the column in the column header

Optional onEditing

onEditing: EventHandler<IEditingEventArgs>

This event occurs before editing, once editing has started, before editing has ended, or editing has stopped

Optional onFocusChanged

onFocusChanged: EventHandler<IFocusChangedEventArgs>

This event occurs when the focused row is changed. The event fires on GridLayout or HorizontalLayout

Optional onGrouping

onGrouping: EventHandler<IGroupingEventArgs>

This event occurs when the user updates groups with UI actions. The event is fired before the actual update happens

Optional onRowClick

onRowClick: EventHandler<IRowClickEventArgs>

This event occurs when clicking the row

Optional onRowDbClick

onRowDbClick: EventHandler<IRowClickEventArgs>

This event occurs when double-clicking the row

Optional onRowReorder

onRowReorder: EventHandler<IRowReorderEventArgs>

This event occurs when the user starts dragging the row and before inserting the row at new position

Optional onSelectionChanged

onSelectionChanged: EventHandler<ISelectionChangedEventArgs>

This event occurs when the user changes the selection using UI actions.

Optional options

options: any

Specifies options of layout strategy and other common options like filtering/sorting/grouping.

Optional style

style: CSSProperties

Specifies other styles of the DOM container

Optional width

width: string | number

Specifies width of the DOM container


Optional onCreate

  • onCreate(grid: IGrid): void
  • Callback on each creation of underlying DataView component.


    • grid: IGrid

    Returns void