Datagrid: Add support for filtering in sub grids with nested grids

[swuendri]

Describe the bug A datagrid can have nested datagrids but using the filters you see different/unexpected behavior.

1. Expected filter behavior when main datagrid has filters and nested datagrids not.
2. Expected filter behavior when nested datagrids has filters and main datagrid not.
3. Unexpected filter behavior in case both type of datagrids have filters. In that case only the filter of the main datagrid is working. Filtering in nested datagrids will result in empty datagrid.

To Reproduce Steps to reproduce the behavior:

1. Make the following change to the example of nested datagrids. It's to switch on the filter at nested datagrid and make column partName filterable.

   
   --- a/app/views/components/datagrid/example-nested-grids.html
   +++ b/app/views/components/datagrid/example-nested-grids.html
   @@ -46,7 +46,7 @@
   
          var subColumns = [];
          subColumns.push({ id: 'id', name: 'Part Id', field: 'id', width: 200});
   -          subColumns.push({ id: 'partName', name: 'Part Name',field: 'partName', formatter: Soho.Formatters.Hyperlink});
   +          subColumns.push({ id: 'partName', name: 'Part Name',field: 'partName', formatter: Soho.Formatters.Hyperlink, filterType: 'text'});
          subColumns.push({ id: 'price', name: 'Price', field: 'price'});
          subColumns.push({ id: 'amount', name: 'Amount', field: 'amount'});
          subColumns.push({ id: 'quantity', name: 'Quantity', field: 'quantity'});
   @@ -59,7 +59,7 @@
          subData.push({ id: args.row + '-121227', partName: 'Electronics / Hardware', quantity: 1*args.row, price: .14*args.row, amount: 1.24*args.row});
          subData.push({ id: args.row + '-121228', partName: 'Resilant Sub-Compressor', quantity: 1*args.row, price: .24*args.row, amount: 1.34*args.row});

• datagridHtml.datagrid({stretchColumn: 'partName', filterable: false, columns: subColumns, dataset: subData});

• datagridHtml.datagrid({stretchColumn: 'partName', filterable: true, columns: subColumns, dataset: subData}); });

   grid.on('collapserow', function (e, args) {

  
  2. Start the IDS server `npm start`.
  3. Open the URL `http://localhost:4000/components/datagrid/example-nested-grids.html`
  4. Press the plus sign in first row of `Product Id` `T100`
  5. Input letter `L` in filter field of `Part Name`
  6. You get message `No Data Available` in main datagrid.

Expected behavior All 4 rows in nested datagrid should stay visible, because all have a letter l in Part Name.

Version

• ids-enterprise: I use 4.68.0 but it's also in current version 4.84.1

Screenshots In my opinion not necessary.

Platform

• Device: only using PC
• OS Version: only used at Windows 10 and macOS 13.4
• Browser Name: chrome and safari

Additional context No additional context

[tmcconechy]

So far for the example https://main-enterprise.demo.design.infor.com/components/datagrid/example-nested-grids.html we didn't allow filtering in the nested grid due to technical constraints. Is that the primary issue here that you want to filter in the nested grid and it does'nt work on the inside grid?

Suggestion is to disable filtering for the nested grid for now. Can most likely reproduce it https://main-enterprise.demo.design.infor.com/components/datagrid/example-nested-grids.html if filtering was enabled

[swuendri]

Yes @tmcconechy, you got the primary issue right. Have I overseen something in documentation that filtering in nested grid will not work?

[tmcconechy]

Its not documented that it wont work. But when I tried to implement it it was very difficult and could not get it working within a reasonable amount of time. We can try again when we can but as a workaround i would go without it for now.

[swuendri]

Okay, got it @tmcconechy. And maybe you will find a way to get it working.

[tmcconechy]

@swuendri another option is to try keyWord search to see if it finds nested data (not sure if it does but could be worth a test if that works https://main-enterprise.demo.design.infor.com/components/datagrid/example-keyword-search.html)

[stale[bot]]

This issue has been automatically marked as stale because it has not had recent activity. It will be closed if no further activity occurs. Thank you for your contributions.