Skip to content

AgGrid framework components for React, powered by TypeScript.

License

Notifications You must be signed in to change notification settings

ytkj/ag-grid-react-components

Repository files navigation

ag-grid-react-components

AgGrid framework components for React, powered by TypeScript.

Installation

  1. npm install -S ag-grid-react-components

Usage

RankFilter

  1. import RankFilter
import { RankFilter } from 'ag-grid-react-components'
  1. set RankFilter to columnDef.filterFramework
<AgGridReact
    columnDefs={[
        {
            field: 'field1',
            headerName: 'Rank Filter',
            filterFramework: RankFilter,
        },
    ]}
    {...props}
/>

Result

RankFilter screenshot

Server-side

'rank' filter type can be handled by sqlalchemy-ag-grid with Python + Flask + SQLAlchemy stack.

SetFilter

  1. import setFilterFactory
import { setFilterFactory } from 'ag-grid-react-components'
  1. create SetFilter by setFilterFactory() and set it to columnDef.filterFramework
<AgGridReact
    columnDefs={[
        {
            field: 'field2',
            headerName: 'Set Filter',
            filterFramework: setFilterFactory([
                {key: '', label: ''},
                {key: 'a', label: 'A'},
                {key: 'b', label: 'B'},
                {key: 'c', label: 'C'},
            ]),
        },
    ]}
    {...props}
/>

Result

SetFilter screenshot

Test

  1. git clone https://github.com/ytkj/ag-grid-react-components.git
  2. cd ag-grid-react-components
  3. npm install
  4. npm test
  5. open http://localhost:3000 in your browser.

About

AgGrid framework components for React, powered by TypeScript.

Resources

License

Stars

Watchers

Forks

Packages

No packages published