TanStack / table

🤖 Headless UI for building powerful tables & datagrids for TS/JS - React-Table, Vue-Table, Solid-Table, Svelte-Table
https://tanstack.com/table
MIT License
25.1k stars 3.07k forks source link

Can't disable filtering #5167

Closed kevinmitch14 closed 11 months ago

kevinmitch14 commented 11 months ago

Describe the bug

I am unable to disable filtering on a column. I have set the following on my table config.

const table = useReactTable({
  columns: defaultColumns,
  data: defaultData,
  getCoreRowModel: getCoreRowModel(),
  onColumnFiltersChange: setColumnFilters,
  getFilteredRowModel: getFilteredRowModel(),
  onSortingChange: setSorting,
  getSortedRowModel: getSortedRowModel(),
  state: { columnFilters, sorting },
  enableFilters: false,
  enableColumnFilters: false,
  enableGlobalFilter: false,
  enableSorting: false,
});

Column setup is as follows:

const defaultColumns = [
  columnHelper.accessor("firstName", {
    id: "firstName",
    cell: (info) => info.getValue(),
    enableColumnFilter: false,
    enableGlobalFilter: false,
    enableSorting: false,
  }),
  columnHelper.accessor((row) => row.lastName, {
    id: "lastName",
    cell: (info) => info.getValue(),
    header: () => <span>Last Name</span>,
  }),
  columnHelper.accessor("age", {
    header: () => "Age",
  }),
];

Am I misunderstanding how this works? From the docs it seems that filtering should not work.

The ability for a column to be column filtered is determined by the following:

I am controlling the filter via an input field. onChange, I am also logging getCanFilter(), getFilterValue() and getIsFiltered() and the results are

{getCanFilter: false, getFilterValue:<the input value>, getIsFiltered:true}

Attached is an image with the table.options, and the result of getState()

Screenshot 2023-11-16 at 19 32 16

Your minimal, reproducible example

https://codesandbox.io/s/frosty-lamport-9shvh6?file=/src/App.tsx

Steps to reproduce

Type in input field.

Expected behavior

The columns should not filter based on the input field value.

How often does this bug happen?

Every time

Screenshots or Videos

No response

Platform

React:Latest Browser: All Operating System: Platform: darwin Arch: arm64 Version: Darwin Kernel Version 23.0.0: Fri Sep 15 14:41:43 PDT 2023; root:xnu-10002.1.13~1/RELEASE_ARM64_T6000

react-table version

8.10.7

TypeScript version

5.2.2

Additional context

No response

Terms & Code of Conduct

kevinmitch14 commented 11 months ago

Moment of stupidness on my end I think. My impression was that this was handled by tanstack/form as oppossed to doing a check if column.getCanSort() === true

The wording of this threw me off.

The ability for a column to be column filtered is determined by the following:

  • The column was defined with a valid accessorKey/accessorFn.
  • column.enableColumnFilter is not set to false
  • options.enableColumnFilters is not set to false
  • options.enableFilters is not set to false