Populate filters in data table

UI Components for React
Post Reply
Sakshi.Gupta6
Posts: 9
Joined: 05 Jul 2021, 15:28

16 Aug 2022, 13:36

I'm migrating my application to latest version of prime react, during migration I noticed broken changes in data table filters. So now I'm working on data table fix according to latest version of it.

Having some trouble in populating default filter, I saw in documentation for populating filter something given like this

const filters = {
'name': {operator: FilterOperator.AND, constraints: [
{value: 'Prime', matchMode: FilterMatchMode.STARTS_WITH},
{value: 'React', matchMode: FilterMatchMode.CONTAINS}
]}
}

But when I'm trying with this facing issues, Is there any running demo available for this ?

Just for info: Adding details here
    Using filterDisplay="row"
      Global filter
        Run time field filter change, Filter types in use "in", "custom", "startswith" etc.


        Thanks!

        Melloware
        Posts: 3286
        Joined: 22 Apr 2013, 15:48

        16 Aug 2022, 13:44

        Here is how I define mine...

        Code: Select all

                filters: {
                    'vin': { value: '', matchMode: 'contains' },
                    'make': { value: '', matchMode: 'contains' },
                    'model': { value: '', matchMode: 'contains' },
                    'color': { value: '', matchMode: 'contains' },
                    'year': { value: '', matchMode: 'gte' }
                }
        
        PrimeFaces Developer | PrimeFaces Extensions Developer
        GitHub Profile: https://github.com/melloware
        PrimeFaces Elite 11.0.3 / PF Extensions 11.0.3
        PrimeReact 8.0.0

        Sakshi.Gupta6
        Posts: 9
        Joined: 05 Jul 2021, 15:28

        16 Aug 2022, 15:03

        I tried this but when I apply filters with this format in my table, after applying this when I tried to select a filter application throws JS error like this

        TypeError: filters[field] is undefined
        filterCallback
        node_modules/primereact/datatable/datatable.esm.js:3088

        I have added only those fields in filters in which I want to add default filters and setting it after rendering of application.

        Melloware
        Posts: 3286
        Joined: 22 Apr 2013, 15:48

        16 Aug 2022, 15:10

        See my code sandbox reproducer: https://codesandbox.io/s/primereact-tes ... entList.js

        You can mess with it yourself.
        PrimeFaces Developer | PrimeFaces Extensions Developer
        GitHub Profile: https://github.com/melloware
        PrimeFaces Elite 11.0.3 / PF Extensions 11.0.3
        PrimeReact 8.0.0

        Post Reply

        Return to “PrimeReact”

        • Information
        • Who is online

          Users browsing this forum: No registered users and 1 guest