React-table: Search Feature for React Table?

[quangdv90]

I wonder when you will launch the search feature for react table?

[gary-menzel]

ReactTable has the filter feature. There is no search feature. You can override the filter methods and create your own external searching/filtering to ReactTable.

ReactTable is different to a lot of other table components. Only the most basic functionality is provided and it is up to the developer to build the other functions they need using the rich API overrides provided.

[ViswanathL]

How to add a single external input field to filter the table instead of filter for each field ? Any idea

[gary-menzel]

The short answer is you just have to dig into the doco and come up with something...

Every use-case is different but this example (which has a mixture of things) might provide some ideas....

https://codesandbox.io/s/r74mokr5x4

NOTE: the defaultFilterMethod in the above example matches from the start of the string - you could change that to match anywhere and any way you like (even a regular expression). But it is something you have to work out for your own purposes. The filterMethod on the 'firstName' column uses an includes rather than matching the start.

This is why ReactTable provides nothing but column filtering out of the box - it is too "heavy" to provide all the different use cases. So the developer has to provide those.

[midnightcodr]

@gary-menzel Is there a way to hide column filtering in the example you gave? I have a very similar case but I want the filtering to be handled completely by an external form.

[gary-menzel]

You could provide getTheadFilterProps and return props that hide the div - but there is no "switch" to turn it off as such. Just remember that if you want React Table to do the filtering on the array, then the column definition must exist and it must be filterable - otherwise React Table won't do anything. Your external form has to supply the filter prop to your React Table instance in the correct format (it's in the docs).