Hello,
Is there a way to change the field value that is sent to the filtering logic within a grid when using either firstFilterProps or secondFilterProps .onChange events? I can update the operator and value but can't pass in a custom value or operator object.
So for example this causes an error
const value = {value: e.target.value, field: test.field}firstFilterProps.onChange({ value, operator: firstFilterProps.operator, syntheticEvent: e.syntheticEvent})
For example, there are two dropdown list components and an input component. The first dropdown list values are the filter operators (contains, is equal to, etc). The second dropdown list values are dynamically driven db fields (test.field, test.anotherfield, etc). The input is the value that the user wants to search.
So is there a way to either pass in that second dropdown list value as another key in the firstFilterProps/secondFilterProps object that goes to filtering OR a way to change the field value.
firstFilterProps.onChange({ value, operator: firstFilterProps.operator, syntheticEvent: e.syntheticEvent, field: test.field});1 Answer, 1 is accepted
Hello, James,
Thank you for the details.
This is possible with the ColumnMenuFilter.
The field is controlled by the props passed to the component.
I can suggest having a state to the component that will control the field value.
Also, set a key to the component, so it is re-initialized when the field is changed.
I made an example showcasing this:
https://stackblitz.com/edit/react-phc63f-jiz8zf?file=app/customFilterUI.jsx
This may need some small changes to cover all cases, but I hope this helps to find the general approach for it.
Regards,
Stefan
Progress Telerik