Datatable lazyload stops filtering/sorting working.

[stefan1968]

If I enable lazyLoad on the datatable component i.e: -
lazy={true}
onLazyLoad={this.onLazyLoad}


Then column filtering and column sorting stops working.

[mert.sincan]

Hi,

You need to write custom sorting and filtering methods for this issue. Lazy mode is handy to deal with large datasets, instead of loading the entire data, small chunks of data is loaded by invoking onLazyLoad callback everytime paging, sorting and filtering happens. Please see comments in our example;
https://www.primefaces.org/primereact/#/datatable/lazy

Code: Select all

onLazyLoad(event) {
        this.setState({loading: true});
        /* In a real application, make a remote request to load data using state metadata from event
         * event.first = First row offset
         * event.rows = Number of rows per page
         * event.sortField = Field name to sort with
         * event.sortOrder = Sort order as number, 1 for asc and -1 for dec
         * filters: FilterMetadata object having field as key and filter value, filter matchMode as value */
        
        //imitate db connection over a network
        setTimeout(() => {
            if(this.datasource) {
                this.setState({
                    cars: this.datasource.slice(event.first, (event.first + event.rows)),
                    loading: false
                });
            }
        }, 250);
    }