Open somnathpathak opened 5 years ago
@somnath111993 I think trigger the filter/search change after clearing, that is expected behavior. if you dont want to trigger these callback function, you can consider to just remove value in the search file and column filter field via html element instead of API
for example:
document.getElementById('xxx').value = "";
@AllenFang Great. Is there any default id assigned to the search and filter fields, if not then how can I explicitly assign an id to them?
@AllenFang I was able to clear out the search field with the below DOM manipulation
const tableGlobalSearchInputEle = document.querySelector('div.myCustomClass-container div.react-bs-table-search-form input.form-control'); tableGlobalSearchInputEle.value = '';
But since we have multiple column filter fields that are handled remotely, thus to clear them all I use the following code
const tableHeaderTableEle = document.querySelector('table.myCustomClass-headerTable'); const tableHeaderRowEle = tableHeaderTableEle.querySelector('thead tr'); const allColumnFilterInputElements = tableHeaderRowEle.querySelectorAll('div input.filter.text-filter.form-control'); for (const filterInput of allColumnFilterInputElements) { filterInput.value = ''; filterInput.defaultValue = ''; }
There is an issue, as when I clear all the filter fields. The value of the corresponding <input>
field is set to null, but the same is not getting updated on the UI.
Could you provide some inputs on the same?
@AllenFang As filter searchField's value is controlled by state and thus a DOM manipulation is not updating the textBox. We have found a workaround for our TextFilters, this.refs.name.textFilter.state.value = '';
.
It would be great if you could tell us if this could be the right way to achieve it.
this.name.current.textFilter.applyFilter(''); worked for me!
this.name = React.createRef();
I am using default search and column filter and both search and filter change are handled remotely using
onSearchChange()
andonFilterChange()
functions.After reading through few existing issues, I could understand that when using remote the search change and filter change are standalone and it is on the developer on how to use them.
@AllenFang