CODEWITHSUNDEEP
angularag-grid
klmuralimohan
klmuralimohan

Reputation: 951

Ag grid: column filters are not updating after adding the row

I have created Ag-grid with custom column filter. When I add the row in the table filter is not updating.

https://stackblitz.com/edit/ag-grid-custom-filter

enter image description here

Expert Advise please?

HTML

  <ag-grid-angular  #agGrid class="ag-theme-balham cis-ag-grid" [defaultColDef]="defaultColDef"
      [columnDefs]="columnDefs" [rowSelection]="rowSelection" [rowData]="rowData" [suppressMenuHide]="true"
      [rowDragManaged]="true" [frameworkComponents]="frameworkComponents" (selectionChanged)="onSelectionChanged()"
      (rowClicked)='onRowClicked($event)' (gridReady)="onGridReady($event)" (valueChanged)="onCellValueChanged($event)"
       [gridOptions]="gridOptions" >
    </ag-grid-angular>
    <!-- ./ Ag-grid -->

TS

onCellValueChanged(params) {
    var col = params.column;
    switch (col.getId()) {
      case "name":
        this.refreshName(params.api, params.newValue);
        break;
    }
  }

refreshName(api, newValue) {
    var filter = api.getFilterInstance("name");
    var model = filter.getModel();
    filter.resetFilterValues();
    var filterWasActive = model !== null;
    if (filterWasActive) {
      if (model && model.values.indexOf(newValue) < 0) {
        model.values.push(newValue);
      }
      filter.setModel(model);
    }
  }

Adding the Row

 const addedRow = this.gridOptions.api.updateRowData({ add: [selectedView.data] });
      addedRow.add[0].setSelected(true);
      this.gridApi.getFilterInstance("name").resetFilterValues(); // Trying to refresh the filter
      this.gridOptions.api.ensureIndexVisible(addedRow.add[0].rowIndex, "top");

Upvotes: 0

Views: 3401

Answers (1)

Pratik Bhat
Pratik Bhat

Reputation: 7614

You will have to add this line this.gridApi.onFilterChanged(); after removing this line

this.filter4.onNewRowsLoaded();

to let ag-grid know that data was modified externally.

As per docs -

onFilterChanged() - Informs the grid that a filter has changed. This is typically called after a filter change through one of the filter APIs.

Upvotes: 1

Related Questions