Grid refresh not updating to underlying datasource change

[Jakes Potgieter]

Hi

I have a generic grid wrapper around syncfusion grid. When the user clicks on a column to sort, I fire off a EventEmitter from the actionComplete to notify the child control that a column has been sorted.

The underlying data gets sorted correctly when I print it out to console.log, but the view doesn't update to the underlying, even after calling the refresh function.

How do I force the grid to redraw using the newly created sorted data?

ngAfterViewInit() {
  this.storePerformanceColumns = this.storePerformanceDataStructure.getStorePerformanceColumnData();
  this.storePerformanceData = [];
  this.genericGrid.onSortingEvent.subscribe((sorting: Sorting) => {
    if (this._customSortColumns.indexOf(sorting.columnName) > -1) {
      const column: string = `${sorting.columnName}Original`;

      let sortedColumns: StorePerformanceRowData[] = this._payload.sort((a: StorePerformanceRowData, b:StorePerformanceRowData) => {
        if (a[column] > b[column]) {
          return 1;
        }
        if (a[column] < b[column]) {
          return -1;
        }
        return 0;
      });

      if (sorting.direction === 'Ascending') {
        sortedColumns = sortedColumns.reverse();
      }

      // TODO - remove after testing
      sortedColumns.forEach((entry: StorePerformanceRowData) => {
        console.log(entry[column]);
      });
      console.log('');

      this.genericGrid.getGrid().dataSource = new DataManager(sortedColumns);
      this.genericGrid.getGrid().refresh();
    }
  });
}

[Thiyagu Subramani]

Hi Jakes , 

Thanks for contacting Syncfusion support. 

Query : The underlying data gets sorted correctly when I print it out to console.log, but the view doesn't update to the underlying, even after calling the refresh function. 

Based on your shared information we suspect that you want to get grid sorted records and then need to assign it to grid dataSouce. To achieve this requirement we suggest to DataManger’s executeQuery or executeLocal method for sorted records and then assign to Grid DataSource. For more reference please refer below documentation. 

API :  https://ej2.syncfusion.com/documentation/api/data/dataManager/#executequery 

 

       : https://ej2.syncfusion.com/documentation/api/data/dataManager/#executelocal 

UG: https://ej2.syncfusion.com/documentation/data/querying/#sorting 

If still facing the issue, please share below details then only we provide the appropriate solution as soon as possible. 

1. Share complete Grid rendering code. 

2. Video demonstration of your issue. 

3. If possible share issue reproducing sample. 

4. Syncfusion package version 

Please get back to us, if you need any further assistance. 

Regards, 

Thiyagu S.