Search code examples
reactjsantd

get selected filter options Antd table


I have the following column in my Antd table and I want to send a new request to API when user selects some filter options but I have no idea about how to get the selected options. can anyone help me with this?

{
  title: SECURITY_KEY_DEVICES_TABLE.OS,
  dataIndex: 'OS',
  key: 'OS',
  align: 'center',
  render: (data) => {
    return <span style={{ fontSize: '1rem' }}>{data}</span>;
  },
  filters: [
    {
      text: 'Android',
      value: 'android',
    },
    {
      text: 'IOS',
      value: 'ios',
    },
    {
      text: 'Windows',
      value: 'windows',
    },
  ],
  onFilter: (value, row) => {
    return value == row.OS;
  },
},

Solution

  • You will get the filter object inside second parameter of onChange.

    I suggest you to take a look here

    Observe the console after applying the filter. The second parameter here is the example: =>

    const onChange: TableProps<DataType>['onChange'] = (pagination, filters, sorter, extra) => {
      console.log('params', pagination, filters, sorter, extra);
    };