Expand all children group items on React Wijmo

Expand all children group items on React Wijmo

Posted by: ozan.bilgic on 3 April 2023, 7:29 am EST

• 

  ozan.bilgic

  • Post Options:
  • Link
    Copy
  • Jump To Answer

  Posted 3 April 2023, 7:29 am EST

  I have a table created by FlexGrid component. On my table I have 2 level of groups, and these groups are collapsed by default. When I expand parent group, I want all children groups to be expanded automatically. Is there a way to achieve this?

  my code is like below:

  <FlexGrid
          itemsSource={source}
          initialized={(flexgrid: wjGrid.FlexGrid) => {
            setTimeout(() => {
              flexgrid.autoSizeRows();
              flexgrid.collectionView.refresh();
              flexgrid.collapseGroupsToLevel(0);
              setIsInitialized(true);
              flexgrid.focus();
            }, 50);
          }}
          id="ltc_sheet"
          isReadOnly={true}
          frozenColumns={1}
          showMarquee={true}
          autoRowHeights={true}
          style={{
            display: isInitialized ? 'block' : 'none',
          }}
        >
          <FlexGridFilter
            showFilterIcons={true}
            showSortButtons={true}
            filterColumns={Object.keys(wijmoData[0])}
          />
          {columns?.map((item, index) => (
            <FlexGridColumn
              header={item.header}
              binding={item.binding}
              minWidth={item.minWidth}
              key={item.header}
              allowResizing={item.allowResizing}
              visible={item.visible}
            />
          ))}
        </FlexGrid>

• 

  manish.gupta

  

  • Post Options:
  • Link
    Copy

  Posted 5 April 2023, 8:24 am EST

  Hi,
  
  We may do the required by adding handler for groupCollapsedChanging event of FlexGrid. In this we may iterate over the rows and set the isCollapsed property of GroupRow to false. We may use level property of GroupRow to check if the current row is at the same level of the parent group row.
  
  Please refer to this sample for reference: https://codesandbox.io/s/flexgrid-goups-sample-forked-xyc9bx

  Regards,
  
  Manish Gupta