Custom FilterElement with FilterFunction, how to

UI Components for React
Post Reply
Posts: 2
Joined: 29 Mar 2019, 11:18

29 Mar 2019, 11:27

Hi, how to make simple filterElement as two InputText like and filter DataTable for all digits between those two filters??? Have tried separately filterELement and FilterFunction but both together does not working?? Any ideas, advice??

Posts: 4081
Joined: 29 Jun 2013, 12:38

10 Sep 2019, 13:55


You can use filter method for this issue. Please examine the following code;

Code: Select all

    yearFilter(value, filter) {
        // your custom method. I think you can use val1 and val2.

    renderYearElements() {
                <InputText onInput={(e)=> this.setState({val1:}, () => this.dt.filter(this.state.val1, 'year', 'custom'))}></InputText>
                <InputText onInput={(e)=> this.setState({val2:}, () => this.dt.filter(this.state.val2, 'year', 'custom'))}></InputText>

    render() {
        return (
            <DataTable value={} ref={(el)=> this.dt = el}>
                <Column field="vin" header="Vin" filter={true} />
                <Column field="year" header="Year" filter={true} filterElement={this.renderYearElements()} filterMatchMode="custom" filterFunction={this.yearFilter}/>
                <Column field="brand" header="Brand" filter={true} />
                <Column field="color" header="Color" filter={true}  />
Best Regards,

Post Reply

Return to “PrimeReact”

  • Information
  • Who is online

    Users browsing this forum: No registered users and 1 guest