Prime Community Forum

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>