(Showing Draft Content)

FlexGrid Class

FlexGrid Class

React component for the wijmo.grid.FlexGrid control.

The flex-grid component may contain the following child components: wijmo.react.grid.detail.FlexGridDetail , wijmo.react.grid.filter.FlexGridFilter , wijmo.react.grid.immutable.ImmutabilityProvider , wijmo.react.grid.FlexGridColumn , wijmo.react.grid.FlexGridColumnGroup and wijmo.react.grid.FlexGridCellTemplate.

The component supports all properties and events of the pure JavaScript wijmo.grid.FlexGrid control it represents.

The component includes an initialized event that is raised when the control is initialized after it is added to the page. You can use this event to perform further initialization in addition to setting properties in JSX. The signature of the handler function is the same as any other Wijmo event handlers.

The example below shows how to instantiate and initialize a wijmo.grid.FlexGrid control in JSX:

  autoGenerateColumns={ false }
    { binding: 'name', header: 'Name' },
    { binding: 'sales', header: 'Sales', format: 'c0' },
    { binding: 'expenses', header: 'Expenses', format: 'c0' },
    { binding: 'active', header: 'Active' },
    { binding: 'date', header: 'Date' }
  itemsSource={ this.state.data } />

The code sets the autoGenerateColumns property to false, then sets the columns property, and finally sets the itemsSource property. This order is important, it prevents the grid from automatically generating the columns.