I'm trying to get the value a user types as input of a filter with AG grid, like in a simple input with onChange function.
i tried onFilterChanged, but couldn't catch the value.
<div style={containerStyle}>
<div style={gridStyle} className="ag-theme-alpine">
<AgGridReact
rowData={all.flat().reverse()}
columnDefs={columnDefs}
groupIncludeFooter={true}
groupIncludeTotalFooter={true}
defaultColDef={defaultColDef}
animateRows={true}
onFilterChanged={(e: any) =>
console.log("filter has changed", e)
}
></AgGridReact>
</div>
</div>
thanks for your help.
gridRef is necessary and loop all columns if any of each column contains a filtered string
html
ref={gridRef}
onFilterChanged={handleFilter}
jsx
const GridExample = () => {
const gridRef = useRef();
///...columndefs and rowdata
}
this.handleFilter=()=> {
alert(gridRef.current.api.getFilterInstance('athlete').appliedModel.filter);
};
if second filter is active, gridRef.current.api.getFilterInstance('athlete').appliedModel.condition1.filter and gridRef.current.api.getFilterInstance('athlete').appliedModel.condition2.filter
Edited to Add: gridRef.current.api.getFilterModel() is possible which outputs json objects of all given filters.
{
'athlete':
{
condition1:
{
filterType: 'text',
type: 'contains',
filter: 'a'
},
condition2:
{
filterType: 'text',
type: 'contains',
filter: 'b'
},
filterType: "text",
operator: "AND"
},
'age':
{
filterType: 'text',
type: 'contains',
filter: 'c'
},
}
and if it is global filter (filtered from textbox outside grid), gridRef.current.api.filterManager.quickFilterParts is possible
Collected from the Internet
Please contact [email protected] to delete if infringement.
Comments