Filters does not work with lazy loading - datatable

[sajjanhubale]

Hi Team,

I am not able to filter the data with lazy loading in datatable.

can you please help how can we do this?

Appreciate your response!

Regards,
Sajjan Hubale

[sajjanhubale]

can you please help to solve the problem of filter issue?

[sajjanhubale]

Hi Team,

It would be grate if you can implement this feature.

Regards,
Sajjan

[janishaik]

Even we also facing same issue, let us know if we have any solution for this issue.

[mert.sincan]

Hi all,

You need to implement it by yourself using onFilter method.Exp;

Code: Select all

onFilter(event) {
        //event.filters -> Collection of active filters.
        
        this.setState({
            loading: true
        });

        //imitate delay of a backend call
        setTimeout(() => {    
            this.setState({
                first: 0,
                cars: // the returned value from backend,
                totalRecords: // the returned value's length
                loading: false,
                filters: event.filters
            });
        }, 1000);
    }

Code: Select all

<DataTable value={this.state.cars} paginator={true} rows={this.state.rows} totalRecords={this.state.totalRecords}
                        lazy={true} first={this.state.first} onPage={this.onPage} loading={this.state.loading} filters={this.state.filters} onFilter={this.onFilter}>
                        <Column field="vin" header="Vin" filter={true}/>
                        <Column field="year" header="Year" />
                        <Column field="brand" header="Brand" />
                        <Column field="color" header="Color" />
                    </DataTable>

Best Regards,