Search code examples
ag-gridmaster-detailag-grid-react

Ag-grid: How to get count of search result data after api.setQuickFilter on master and details table


How we can apply setQuickFilter on Detail Grids. to find data left after the filter.

Tried to use api.setQuickFilter(document.getElementById('filter-text-box').value) where api is GridApi of master table. it's just doing search in master table and but not in Detail Grids. so we tried below

// first on details  
api.forEachDetailGridInfo((detailGridInfo)
{
  detailGridInfo.api.setQuickFilter(document.getElementById('filter-text-box').value);
});
// then on master 
api.setQuickFilter(document.getElementById('filter-text-box').value)

But its removing the all details table if nothing matches on details table then not able to search on mater table.

  • Able to search both detail data and master data for a string.
  • Get the count of filter result after filter.

Solution

  • May be it will help someone who is looking for such case.

    // assuming where api=gridApi;
    
    let rowMasterData = [];
    let rowDetailsData = [];
        
    // first on details  
    api.forEachDetailGridInfo((detailGridInfo)
    {
      detailGridInfo?.api?.setQuickFilter(document.getElementById('filter-text-box').value);
     detailGridInfo?.api?.forEachNodeAfterFilter(node => {
          rowDetailsData?.push(node.data);
        });
    });
    // then on master 
    api?.setQuickFilter(document.getElementById('filter-text-box').value)
    api?.forEachNodeAfterFilter(node => {
          rowMasterData?.push(node.data);
        });
    const totalCount = rowMasterData?.length + rowDetailsData?.length;