React-table: Filtering leaves empty lines

Created on 16 Oct 2017  路  3Comments  路  Source: tannerlinsley/react-table

If you have pagination turned off and the defaultPageSize set to be the size of your data set, when you apply a column filter you end up with empty lines at the bottom of the table.

I'd like to request a change so that the table dynamically resizes in the case where a filter is applied and no pagination is being used. This appears fairly straight forward to accomplish by modifying setStateWithData in lifecycle.js by changing

        // Calculate pageSize all the time
        if (newResolvedState.sortedData) {

          newResolvedState.pages = newResolvedState.manual ? newResolvedState.pages : Math.ceil(newResolvedState.sortedData.length / newResolvedState.pageSize);
          newResolvedState.page = Math.max(newResolvedState.page >= newResolvedState.pages ? newResolvedState.pages - 1 : newResolvedState.page, 0);
        }

to this

        // Calculate pageSize all the time
        if (newResolvedState.sortedData) {
          if (!newResolvedState.showPaginationBottom && !newResolvedState.showPaginationTop){
            newResolvedState.defaultPageSize = newResolvedState.sortedData.length;
            newResolvedState.pageSize = newResolvedState.sortedData.length;
          }
          newResolvedState.pages = newResolvedState.manual ? newResolvedState.pages : Math.ceil(newResolvedState.sortedData.length / newResolvedState.pageSize);
          newResolvedState.page = Math.max(newResolvedState.page >= newResolvedState.pages ? newResolvedState.pages - 1 : newResolvedState.page, 0);
        }

additionally, this may also be fixed by passing the sorted data via props, as requested in
#457 allowing you to set the defaultPageSize to the length of the sortedData.

Feature Request Low

Most helpful comment

Can you set minRows to 0? I believe I ran into a similar issue with having pagination turned on and if the last page had less rows than defaultPageSize, then it would populate empty rows.

All 3 comments

This is likely to be low priority as a workaround is possible by using onFilteredChange to capture when the filter changes and adjust the defaultPageSize outside of the component - passing it as a prop.

Can you set minRows to 0? I believe I ran into a similar issue with having pagination turned on and if the last page had less rows than defaultPageSize, then it would populate empty rows.

Closing due to issue age. If you think this issue needs to be reopened, please check the latest version of React-Table for the issue once more and reopen if appropriate. Thanks!

Was this page helpful?
0 / 5 - 0 ratings

Related issues

ocalde picture ocalde  路  3Comments

tremby picture tremby  路  3Comments

missmellyg85 picture missmellyg85  路  3Comments

krishna-shenll picture krishna-shenll  路  3Comments

Abdul-Hameed001 picture Abdul-Hameed001  路  3Comments