foreach incrementation

RE: foreach incrementation

Mike Schmitt — Wed, 20 Jul 2022 16:22:41 GMT

I agree, getting used to the way local variables works in Appian (including scoping) takes some getting used to, as it doesn't behave the same way as it typically works in other programming languages, in a few important aspects. But when you get used to how it DOES work, especially when you understand what i call "update chaining", it gets REALLY powerful. Generally I suggest starting with smaller, simpler examples and gradually stepping up the complexity when you really understand what you currently have.

BTW if you found my above code snippet useful, I would appreciate a "verify answer" and/or upvote when convenient for you.

RE: foreach incrementation

nandhinip — Wed, 20 Jul 2022 14:50:35 GMT

Thanks for your response.

RE: foreach incrementation

nandhinip — Wed, 20 Jul 2022 14:50:22 GMT

yes, As a beginner,has confusions to understand the behaviour of local variables and the scope. Thanks for the clear response.

RE: foreach incrementation

Mike Schmitt — Wed, 20 Jul 2022 14:28:19 GMT

You're doing a lot of repeated / hardcoded calculations on things like column positioning, causing the code to get too complicated to read pretty quickly as we can see here. Meanwhile you're not properly calculating the proper column position for each data cell in a programmatic way, which is tripping up what you're trying to do.

The suggestion I always make with this is to let your local variables do some of the heavy lifting, then simply iterate. First, we set a local variable to the number of total columns (to prevent it from being hardcoded everywhere and thus incomprehensible). Then we step over the original data array and create a new array containing the initial data plus a new element indicating its column position, using the MOD() operator over the item's index and the number of columns.

This forms a secondary local variable array matching the first one, but with elements like this:

Then instead of doing so much stressful redundant calculation inside the columns / cards, we can just rely on the column number stored in the current local variable position.

And then when it's time to print out the actual values, we can get rid of some of the mess:

In this way you can have a dynamic display of tiles in columns, whether it's 2 columns,

...or 3 columns,

...or 7 columns...
... and so-on.

a!localVariables(
  local!selectedColumn:0,
  local!createdcard:0,
  local!datas: {
    {Name: "Name1", Description: "Description1"},
    {Name: "Name2", Description: "Description2"},
    {Name: "Name3", Description: "Description3"},
    {Name: "Name4", Description: "Description4"},
    {Name: "Name5", Description: "Description5"},
    {Name: "Name6", Description: "Description6"},
    {Name: "Name7", Description: "Description7"},
    {Name: "Name8", Description: "Description8"},
    {Name: "Name9", Description: "Description9"},
    {Name: "Name10", Description: "Description10"},
    {Name: "Name11", Description: "Description11"},
    {Name: "Name12", Description: "Description12"},
    {Name: "Name13", Description: "Description13"},
    {Name: "Name14", Description: "Description14"},
    {Name: "Name15", Description: "Description15"},
  },
  local!selectedCard,
  
  
  local!numColumns: 4,
  
  local!columnPositions: a!forEach(
    local!datas,
    a!localVariables(
      local!modulo: mod(fv!index, local!numColumns),
      a!map(
        data: fv!item,
        column: if(local!modulo = 0, local!numColumns, local!modulo)
      )
    )
  ),
  
  {
    a!richTextDisplayField(
      labelPosition: "COLLAPSED",
      value: {
        a!richTextItem(
          text: "Data",
          color: "#b366ff",
          size: "LARGE"
        ),
      },
      showWhen: isNull(local!selectedCard),
      align: "CENTER"
    ),  

    {
      a!columnsLayout(
        marginBelow: "NONE",
        spacing: "SPARSE",
        columns: {
          a!forEach(
            items: 1 + enumerate(local!numColumns),
            expression: {
              a!localVariables(
                local!columnIndex: fv!index,
                
                a!columnLayout(
                  contents: {
                    a!forEach(
                      /*items: 1+enumerate(count(local!datas.Name)),*/
                      items: local!columnPositions,
                      expression: if(
                        fv!item.column <> local!columnIndex,
                        {},
                        
                        {
                          a!cardLayout(
                            style: "INFO",
                            marginBelow: "STANDARD",
                            contents: {                                    
                              a!richTextDisplayField(
                                labelPosition: "COLLAPSED",
                                value: {
                                  char(10),
                                  char(10),
                                  a!richTextItem(
                                    /*text:if(((fv!index+(local!columnIndex-1)*2)>count(local!datas.Name))," ",local!datas[fv!index+(local!columnIndex-1)*2].Name),*/
                                    text: fv!item.data.Name,
                                    color: "#1a1a00",
                                    size: "MEDIUM"
                                  ),
                                  char(10),
                                  char(10),
                                  a!richTextItem(
                                    /*text: if(((fv!index+(local!columnIndex-1)*2)>count(local!datas.Name))," ",local!datas[fv!index+(local!columnIndex-1)*2].Description),*/
                                    text: fv!item.data.Description,
                                    color: "#1a1a00",
                                    size: "SMALL",
                                    style: "PLAIN"
                                  ),
                                  char(10),

                                  a!richTextItem(
                                    text: " ",
                                    color: "#1a1a00",
                                    size: "SMALL",
                                    style: "PLAIN"
                                  )

                                },
                                align: "LEFT"

                              ),
                              a!richTextDisplayField(
                                labelPosition: "COLLAPSED",                      
                                value: a!richTextItem(                        
                                  text: {
                                    a!richTextIcon(
                                      icon: "external-link",
                                      altText: "external-link"
                                    ),
                                    " ",
                                    "viewmore ",
                                    fv!index
                                    /*&(fv!index+(local!columnIndex-1)*2),*/
                                  },

                                  link: a!dynamicLink(
                                    saveInto: {
                                      /*a!save(local!selectedCard, if(((fv!index+(local!columnIndex-1)*2)>count(local!datas.Name))," ",local!datas[fv!index+(local!columnIndex-1)*2].Name)),*/
                                      a!save(local!selectedCard, fv!index),
                                      /*a!save(local!selectedColumn, 1),*/
                                      a!save(
                                        local!createdcard,
                                        /*(fv!index+(local!columnIndex-1)*2)*/
                                        fv!item.data
                                      )
                                    }
                                  ),
                                  linkStyle: "STANDALONE",
                                  color:"#a64dff"
                                ),
                                align: "CENTER",
                              ) 
                            },
                            height: "SHORT_PLUS",
                            shape: "ROUNDED",
                            /*showWhen: tointeger((fv!index+(local!columnIndex-1)*2))<=count(local!datas.Name),*/
                          ),
                          /*a!cardLayout(showBorder: false), */
                        }
                      )

                    ) 
                  },                          
                  width: "MEDIUM_PLUS"
                )
              )
              /*a!columnLayout()*/
            }
          )
        },
        
        /*showWhen: isNull(local!selectedCard),*/
        showWhen: tointeger(local!selectedColumn = 0)
      )
    }
  }
)

RE: foreach incrementation

rahata9316 — Wed, 20 Jul 2022 11:31:09 GMT

Thanks Stefan, for always a great guide. Actually this code was from Nandinip and most logic was about logic ( Use case was based on two integers Let say 2 & 3) Need to draw dynamic texboxes in sequence with in a way that it should be of 3 columns and 2 rows.

RE: foreach incrementation

Stefan Helzle — Wed, 20 Jul 2022 10:25:07 GMT

Which purpose has the local!item in line 2? And why do you store fv!item inside the outer loop into two different locals?

Regarding variables in Appian Interfaces I recommend my blog article: appian.rocks/.../

Next time, please use this function:

RE: foreach incrementation

rahata9316 — Wed, 20 Jul 2022 09:34:19 GMT

Hi Nandhinip,

I hope this will sort your problem. Hope you will get desired results now.

a!localVariables(
local!item:0,
local!outerEnum: 3,
local!innerEnum: 8,
a!forEach(
items: enumerate( local!outerEnum),
expression: a!columnsLayout(
columns: a!localVariables(
local!outerIndex: fv!item,
local!item:fv!item,
a!forEach(
items: enumerate(local!innerEnum),
expression: a!columnLayout(
contents: a!cardLayout(
style: "INFO",
contents: {
a!textField(

value: ((local!innerEnum * local!item) + fv!index),

),
a!richTextDisplayField(
labelPosition: "COLLAPSED",
align: "CENTER",
value: a!richTextItem(
text:local!item,
color: "#1a1a00",
size: "MEDIUM",
),
),
},
height: "MEDIUM",
shape: "ROUNDED",
),

)
)
)
)
),
)

RE: foreach incrementation

nandhinip — Wed, 20 Jul 2022 07:51:42 GMT

for enumerate(3),getting the below output

if i increase the enumeration to 10 .i.e enumerate(10),getting the below output

RE: foreach incrementation

rahata9316 — Wed, 20 Jul 2022 07:44:33 GMT

Can you please try below code

a!localVariables(
local!item:0,
a!forEach(
items: enumerate(2),
expression: a!columnsLayout(
columns: a!localVariables(
local!outerIndex: fv!item,
local!item:fv!index,
a!forEach(
items: enumerate(3),
expression: a!columnLayout(
contents: a!cardLayout(
style: "INFO",
contents: {
a!textField(

value: (((local!item + fv!index) - 1) + ((local!item - 1) * 2) )

),
a!richTextDisplayField(
labelPosition: "COLLAPSED",
align: "CENTER",
value: a!richTextItem(
text:local!item,
color: "#1a1a00",
size: "MEDIUM",
),
),
},
height: "MEDIUM",
shape: "ROUNDED",
),

)
)
)
)
),
)

RE: foreach incrementation

nandhinip — Wed, 20 Jul 2022 04:24:00 GMT

 a!localVariables(
   local!selectedColumn:0,
   local!createdcard:0,   
   local!datas: {
     {Name:"Name1",Description:"Description1"},
     {Name:"Name2",Description:"Description2"},
     {Name:"Name3",Description:"Description3"},                          
     {Name:"Name4",Description:"Description4"},                          
     {piName:"Name5",Description:"Description5"},
     {Name:"Name6",Description:"Description6"},
     {Name:"Name7",Description:"Description7"},
     {Name:"Name8",Description:"Description8"},                          
     {Name:"Name9",Description:"Description9"},                          
     {Name:"Name10",Description:"Description10"},  
     {Name:"Name11",Description:"Description11"},
     {Name:"Name12",Description:"Description12"},
     {Name:"Name13",Description:"Description13"},                          
     {Name:"Name14",Description:"Description14"},                          
     {Name:"Name15",Description:"Description15"},  
   },
 local!selectedCard,
 {
   a!richTextDisplayField(

     labelPosition: "COLLAPSED",
     value: {
       char(10),         
       a!richTextItem(
         text: "Datas",
         color: "#b366ff",
         size: "LARGE"
       ),
       char(10)
     },

     showWhen: isNull(local!selectedCard),
     align: "CENTER"
   ),  
 
 {
   a!columnsLayout(
     marginBelow: "NONE",
     spacing: "NONE",
     columns: {
       a!columnLayout(),
       a!forEach(
         items: 1+enumerate(2),                        
         expression: {
           a!localVariables(
             local!outerIndex:fv!index,
             a!columnLayout(
               contents: {
                 a!forEach(
                   items:1+enumerate(count(local!datas.Name)),
                   expression: {
                     a!localVariables(
                       local!innerIndex:fv!index,
                       a!cardLayout(
                         style: "INFO",                             
                         contents: {                                    
                           a!richTextDisplayField(
                             labelPosition: "COLLAPSED",
                             value: {
                               char(10),
                               char(10),
                               a!richTextItem(
                                 text:if(((fv!index+(local!outerIndex-1)*2)>count(local!datas.Name))," ",local!datas[fv!index+(local!outerIndex-1)*2].Name),
                                 color: "#1a1a00",
                                 size: "MEDIUM"
                               ),
                               char(10),
                               char(10),
                               a!richTextItem(
                                 text: if(((fv!index+(local!outerIndex-1)*2)>count(local!datas.Name))," ",local!datas[fv!index+(local!outerIndex-1)*2].Description),
                                 color: "#1a1a00",
                                 size: "SMALL",
                                 style: "PLAIN"
                               ),
                               char(10),
                               
                               a!richTextItem(
                                 text: " ",
                                 color: "#1a1a00",
                                 size: "SMALL",
                                 style: "PLAIN"
                               )

                             },
                             align: "LEFT"

                           ),
                           a!richTextDisplayField(
                             labelPosition: "COLLAPSED",                      
                             value: a!richTextItem(                        
                               text: {
                                 a!richTextIcon(
                                   icon: "external-link",
                                   altText: "external-link"

                                 ),
                                 " ",
                                 "viewmore" &" "&(fv!index+(local!outerIndex-1)*2),

                               },

                               link: a!dynamicLink(
                                 saveInto: {
                                   a!save(local!selectedCard, if(((fv!index+(local!outerIndex-1)*2)>count(local!datas.Name))," ",local!datas[fv!index+(local!outerIndex-1)*2].Name)),
                                   a!save(local!selectedColumn,1),
                                   a!save(local!createdcard,(fv!index+(local!outerIndex-1)*2)),
                                   

                                 }
                               ),
                               linkStyle: "STANDALONE",
                               color:"#a64dff"
                             ),
                             align: "CENTER",
                           ) 
                         },
                         height: "MEDIUM",
                         shape:"ROUNDED",
                         showWhen: tointeger((fv!index+(local!outerIndex-1)*2))<=count(local!datas.Name),
                       )
                       

                     ) ,
                     a!cardLayout(showBorder: false), 
                     
                   },

                 ) 
               },                          

               width: "MEDIUM_PLUS"
             )
           ),a!columnLayout()
         }
        
       ),
      
     },                  
     /*showWhen: isNull(local!selectedCard),                  */
     showWhen: tointeger(local!selectedColumn=0)

   ),
 }
 }
 
 )

This is code i have tried

RE: foreach incrementation

nandhinip — Wed, 20 Jul 2022 04:04:12 GMT

i have 2 columns and number of rows depends on dynamic data.

if i have 20 values means first 10 value in column1 and next 10 value in column2.

e.g

outerforeach:enumerate(2)

innerforeach:enumerate(20)

i have used (fv!index+(local!outerIndex-1)*2) ----this logic to print the number from 1 to 20 in the given column layout as suggested earlier in this forum..

but it is printing 1 to 10 in 1st column layout, and 3 to 12 in another column layout.

it is not in sequence. unable to increment the fv!index as well.

RE: foreach incrementation

nandhinip — Wed, 20 Jul 2022 03:56:30 GMT

if the number of row increases , the one which was discussed earlier was not working.

RE: foreach incrementation

Mike Schmitt — Tue, 19 Jul 2022 18:54:45 GMT

I'm not really clear what you're trying to do here overall, but you seem to be misunderstanding how local variables work and how saveInto works. For instance, the local!item: 0 you declare on line 2 is irrelevant to this code snippet as it's never used, since you supersede it in scope by re-declaring local!item inside your forEach loop, on line 8.

Additionally, local!outerIndex is never used either. And the saveInto you're doing in your text field (whether this is your intended behavior or not, i honestly can't tell), just adds 1 to the current grid row's local!item value, regardless of what the user inputs (and has no effect whatsoever prior to the user interacting with the text field).

RE: foreach incrementation

Mike Schmitt — Tue, 19 Jul 2022 18:44:06 GMT

Please use a Code Box, which preserves indentation/formatting and improves readability of code (back up out of the negatives)...

RE: foreach incrementation

Harshit Bumb (Appyzie) — Tue, 19 Jul 2022 18:43:06 GMT

Isn't it somewhat the same post - community.appian.com/.../nested-for-each