[Bug]: Table results do not filter after selecting a lookup filter #2062
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
Related Issue
I was able to resolve the bug that does not filter the table results after clicking a lookup filter without creating an issue, but will open one if necessary
Description
After rendering a table that has a column containing a
lookup
, then in the UI after selecting a lookup filter from the Select dropdown the Table does not update with the filtered result setBug Demo: https://codesandbox.io/s/material-tablelookup-filter-bug-m9lmi?file=/src/App.js
Solution
Inside the
m-table-filter-row.js
component there is an onClose handler that passesevent
intothis.props.onFilterChanged(columnDef.tableData.id, event.target.value);
. When onClose is calledevent
isundefined
, which is the source of the bug. Sincem-table-filter-row.js
already has declared a piece of state that has theselectedFilter
, I have updated the onClose handler to passselectedFilter
i.e.this.props.onFilterChanged(columnDef.tableData.id, selectedFilter);
which resolves the bug and will actually filter the result set in the UI when a lookup filter is selected.Impacted Areas in Application
List general components of the application that this PR will affect:
m-table-filter-row.js