Search code examples
angularag-gridag-grid-angularag-grid-reactag-grid-ng2

GridApi.setFilterModel ag-grid not working properly

I have following code

onGridReady = (event: GridReadyEvent) => {     
   this.gridApi.setFilterModel(init.filterModel);
}

init.filterModel- it is object with 2 keys after setFilterModel executed in this.gridApi.getFilterModel() there's only one key instead of two key.

but in this variant

onGridReady = (event: GridReadyEvent) => {
    this.gridApi.setFilterModel(init.filterModel); // sleep(1ms)     
    new Promise(resolve => setTimeout(resolve, 1)).then(() => {   } 
}

gridApi.getFilterModel() returns valid result, how it can be solved without this hack?

gridApi.getFilterModel() returns valid result, how it can be solved without this hack?

Solution

  • It's hard to spot your exact problem without more details but let's give it a shot

    Modify your onGridReady event like the following

    onGridReady: (params) => {
  var filterModel = params.api.getFilterModel();
  console.log('filterModel first', filterModel);
},

    and your onFirstDataRendered event like the following

    onFirstDataRendered: (params) => {
  var hardcodedFilter = {
    country: {
      type: 'set',
      values: ['Ireland', 'United States'],
    },
    age: { type: 'lessThan', filter: '30' },
    athlete: { type: 'startsWith', filter: 'Mich' },
    date: { type: 'lessThan', dateFrom: '2010-01-01' },
  };
  params.api.setFilterModel(hardcodedFilter);

  filterModel = params.api.getFilterModel();
  console.log('filterModel last', filterModel);
},

    Result:

    Result

    As you see, the first state of our filterModel object is different from its last state, no need to wait between using a promise.

    Plunker: https://plnkr.co/edit/hh4DRg6LD3XwsrZR?preview

    NOTE: I have used plain javascript here, you may need to modify it a little bit if you use a framework