How to use external filter with React? (ag-grid)

1
votes

Ag-grid does not give a react example on how to use external filters with React. I've followed the example anyway and tried to use gridOptions declaratively as I was doing:

<AgGridReact
    rowData={this.state.rowData}
    columnDefs={this.state.columnDefs}
    defaultColDef={this.state.defaultColDef}
    groupDefaultExpanded={this.state.groupDefaultExpanded}
    masterDetail={true}
    detailRowHeight={this.state.detailRowHeight}
    detailCellRendererParams={this.state.detailCellRendererParams}
    onGridReady={this.onGridReady}
    enableRangeSelection={true}
    pagination={true}
    sideBar={this.state.sideBar}
    isExternalFilterPresent={true}
    doesExternalFilterPass={(node) => {
        alert(node);
    }}
/>

I trigger the filterChanged manually just like on the example:

<Col xs='3'>
    <Field
        component={renderSelectField}
        name="relatorio-filtro"
        hintText='100'
        variant="outlined"
        selectStyle={relatorioFiltro}
        disable={() => { }}
        onChange={(e) => {
            this.gridApi.onFilterChanged()
        }}
    >
        <div value="15" key="15">{"15"}</div>
        <div value="25" key="25">{"25"}</div>
        <div value="50" key="50">{"50"}</div>
        <div value="100" key="100">{"100"}</div>
        <div value="200" key="200">{"200"}</div>
    </Field>
</Col>

But it's no use, that alert never happens. I suspect such feature does not work for React.

1
javascriptreactjsag-grid

1 Answers

0
votes

from the page you provided:

isExternalFilterPresent is called exactly once every time the grid senses a filter change. It should return true if external filtering is active, otherwise false. If you return true, then doesExternalFilterPass() will be called while filtering, otherwise doesExternalFilterPass() will not be called.

so it seems to me you should try something like this:

isExternalFilterPresent={()=> {return true;} }