Custom Search Field Bug

[evanpatsou]

Expected Behavior

The parent component contains some of the option ( column, data, options). The child component should receive those options of the parent component and add the functionality of the search bar:

Child:

    const [searchText, setSearchText] = useState('');
        const tbOptions = {
              ...props.options,
             searchText: searchText,
             customSearch: (searchQuery, currentRow, columns) => { github's examples code }
         }

        return (
            <SearchBar onSearch={props.onSearch} value={props.searchText} />
            <MUIDataTable data={props.data} columns={props.columns} options={props.options}/>
        )

Current Behavior

The search doesn't work. But if you elevate the code at the parent component it works like a charm.

Your Environment

Tech	Version
Material-UI	^4.8.3
MUI-datatables	^2.13.3
React	6.12.0
browser	Chrome
etc

[gabrielliwerant]

Hey @vangpatsou, I'm not too sure what you're trying to do, but if you have a look at the customize-search example, it will demonstrate how the custom search is intended to be used.

[evanpatsou]

Hey @vangpatsou, I'm not too sure what you're trying to do, but if you have a look at the customize-search example, it will demonstrate how the custom search is intended to be used.

Hey @gabrielliwerant, thanks for the reply! So, due to the fact that each application's data table contains an external search field, I have made a wrapper-component that it will take the options of the muidatable and it will combine them with the search field to the child component. But since you pass the columns as props, the search functionality won't work.