How to create dynamic Tabs

Hi All

I have a requirement to create dynamic tabs based on certain conditions.

I tried below code but is not working.

The foreach in choose section is not returning the list.

{
a!localVariables(
local!selectedTab: 1,
local!names: {"1", "2", "3"},
{
a!buttonArrayLayout(
buttons: {
a!forEach(
items: local!names,
expression: a!localVariables(
local!modified,
a!buttonWidget(
label: "Tab1 "&fv!item,
saveInto: {a!save(local!selectedTab, fv!item)},
size: "SMALL",
style: if(local!selectedTab = fv!item, "PRIMARY", "LINK")
),
)
)
}
),
{
choose(
local!selectedTab,
a!forEach(
items:local!names,
expression: a!localVariables(
a!forEach(
items: {1},
expression:{
a!textField(
label:"Enter data",
),

},
)
)
),
)
}
}

)
}

  Discussion posts and replies are publicly visible

Parents
  • The issue here is with the use of the choose() function, I do not believe we will be able to dynamically add choice parameters since they will be treated as one choice of a list of items. 

    However, you can accomplish this in a few ways - this solution builds a list of a!sectionLayout(), which are only shown when the selectedTab matches fv!index of the a!forEach():

    a!localVariables(
      local!selectedTab: 1,
      local!names: {"1", "2", "3"},
      {
        a!buttonArrayLayout(
          buttons: {
            a!forEach(
              items: local!names,
              expression: a!localVariables(
                local!modified,
                a!buttonWidget(
                  label: "Tab1 "&fv!item,
                  saveInto: {a!save(local!selectedTab, fv!item)},
                  size: "SMALL",
                  style: if(local!selectedTab = fv!item, "PRIMARY", "LINK")
                ),
              )
            )
          }
        ),
        {
          a!forEach(
            items: local!names,
            expression: a!sectionLayout(
              showWhen: fv!index=local!selectedTab,
              contents: {
                a!textField(
                  label: concat("Enter Data ",fv!item)
                )
              }
            )
          )
        }
      }
    )

    Also, when posting code snippets please take advantage of the Insert -> Code feature for readability.

  • Great!  Feel free to mark this thread as answered if you would be so kind :) 

Reply Children
No Data