antd table with onFilter not firing when also using Input.Search on another column

43 Views Asked by At

Using Antd@^5.8.3 React 18.2.0

I want the table to use a Input.Search to find rows quickly by identifier. On another column I am using onFilter, but it is not firing. Searchtext is in useState. Filter presents the options, I can select one or more, but column's onFilter is not filtering (proved this using chrome debugger with breakpoint in onFilter function. enter image description here

      const cbSpecialistColumns: ColumnProps<INotification>[] = [
        {
          title: "Description",
          dataIndex: "RuleDescription",
          key: "RuleDescription",
          width: 200,
          responsive: ["sm"],
          filters: rules,
          filterMultiple: true,
          onFilter(value: string | number | boolean, record: INotification) {
            console.log("filter value" + value + " rule " + record.RuleDescription);
            return record.RuleDescription.indexOf(value.toString()) === 0;
          },
        },
        {
          title: "BSP/BAP Number",
          dataIndex: "GSANumber",
          key: "GSANumber",
          width: 120,
          filteredValue: [searchText],
          onFilter: (value, record: INotification) => {
            return String(record.GSANumber)
              .toLowerCase()
              .includes(String(value).toLowerCase());
          },
          render: (text: string) => <span>{text}</span>,
          responsive: ["sm"],
        },
0

There are 0 best solutions below