Skip to main content
June 16, 2022
Question

Selectable rows in tree grid

  • June 16, 2022
  • 6 replies
  • 0 views

Hello!

I'm trying to implement a tree grid using the gridlayout() component in an Interface. I've been able to make it hierarchical (Once you click on a row, new subrows appear just under it) with loops and local variables to show or hide those subrows

I now need to make the rows selectable on the grid, but I specifically also want that if I click a row, its subrows get automatically selected as well

To give a little more of context, imagine a dictionary of 6 keys where every key defines a level in the tree grid. First all distinct values for the first key appear, and when clicking in one of them, all distinct values for the second key of elements that have that clicked value on the first key appear.

6 replies

stefanhelzle0001
Brainy
June 16, 2022

It should be enough to add a saveInto() to add the IDs of the subrows to the selected items. Do you have any code snippets?

June 16, 2022

rows: {
      a!gridRowLayout(
        contents: {
          a!richTextDisplayField(
            value:a!richTextItem("FundHouse Name","STRONG")),
          a!richTextDisplayField(value: ""),
          a!richTextDisplayField(value: "")
        }
      ),
      a!forEach(
        rule!PM_FilterTreeGridAPI(local!revenues, "sFundHouseName"),
        {
          a!localVariables(
            local!show2: false,
            local!value: fv!item,
            {
              a!gridRowLayout(
                contents: {
                  a!richTextDisplayField(
                    value: a!richTextItem(
                      text: if(
                        local!show2,
                        concat(char(9), "- ", fv!item),
                        concat(char(9), "+ ", fv!item)
                      ),
                      style:if(local!show2,
                      "STRONG","PLAIN"),
                      link: a!dynamicLink(
                        saveInto: a!save(local!show2, not(local!show2))
                      )
                    )
                  ),
                  a!richTextDisplayField(value: ""),
                  a!richTextDisplayField(value: "")
                }
              ),
              a!gridRowLayout(
                showWhen: local!show2,
                contents:{a!richTextDisplayField(value:a!richTextItem(concat(char(9),"Distributor Name"),"STRONG")),
                a!richTextDisplayField(value:""),
                a!richTextDisplayField(value:"")}
              ),
              a!forEach(
                rule!PM_FilterTreeGridAPI(
                  rule!PM_FilterTreeGridfran(local!revenues, { local!value }),
                  "sDistributorName"
                ),
                {a!localVariables(
                
                ...

My code looks like that (I stopped in local variables since there I repeat the process until I finish with the 6th key). To that I would need to add that "hierarchical select" I'm looking for. How would your structure be added to that?

stefanhelzle0001
Brainy
June 16, 2022

I assume that you use the OOTB selection feature of the grid. Each row has a unique ID, adding this ID to the selectionValue parameter of the grid will make these rows selected.

Now, with some logic in the selectionSaveInto, you should be able to add all sub-rows on selection of a parent row.