以编程方式删除所有分组和过滤的简单方法

Tok*_*o D 5 ag-grid asp.net-core-3.1

当网格加载时,没有应用分组/过滤。我希望能够删除用户手动应用的任何分组/过滤,即将网格格式恢复到其原始状态。

san*_*shi 1

你可以定义一个函数来重置一切

 function ResetGrid(){
   //clear filters
 gridOptions.api.setFilterModel(null);
 //notify grid to implement the changes
 gridOptions.api.onFilterChanged();

 //remove all pivots
 gridOptions.columnApi.setPivotColumns([]);
// disable pivot mode
 gridOptions.columnApi.setPivotMode(false);
 //reset all grouping
 gridOptions.api.setColumnDefs(columnDefs);
//where columDefs is the object you used while creating grid first time.
  }    
Run Code Online (Sandbox Code Playgroud)

上面的方法可以满足您的需求,但更复杂的方法是保存列状态(它可能处于初始阶段或在某些操作之后)。

    function saveState() {
     window.colState = gridOptions.columnApi.getColumnState();
     window.groupState = gridOptions.columnApi.getColumnGroupState();
     window.sortState = gridOptions.api.getSortModel();
     window.filterState = gridOptions.api.getFilterModel();
     console.log('column state saved');
      }

    function restoreState() {
      if (!window.colState) {
        console.log('no columns state to restore by, you must save state first');
        return;
      }
      gridOptions.columnApi.setColumnState(window.colState);
      gridOptions.columnApi.setColumnGroupState(window.groupState);
      gridOptions.api.setSortModel(window.sortState);
      gridOptions.api.setFilterModel(window.filterState);
      console.log('column state restored');
    }

    function resetState() {
      gridOptions.columnApi.resetColumnState();
      gridOptions.columnApi.resetColumnGroupState();
      gridOptions.api.setSortModel(null);
      gridOptions.api.setFilterModel(null);
      console.log('column state reset');
    }
Run Code Online (Sandbox Code Playgroud)

这是一个演示