How Do I Alternate Row Layouts in a ForEach Loop?
This article describes how to change or alternate row layouts in a ForEach loop. Sometimes the records being iterated through in a ForEach loop need to be displayed differently based on some difference between those records. In this example, we build an employee directory, and when laying out the records alternate between inside and outside sales staff. Inside sales staff shows an office location while outside sales staff will show a mobile number instead. To follow along please download this example template here.
Our example template looks like the following:
The employee table above has two different rows. One for inside sales staff showing in the last column their office location while the other row is for outside sales staff showing in the last column their mobile phone instead. To achieve this we will place an If tag just after our ForEach tag and then in the second row place our else tag and finally just before our EndForEach tag we will place our EndIf tag. This allows us to create a test condition that evaluates their title and based on evaluation choose the appropriate row for our Out tags.
Now create the If tag test condition that evaluates the title to determine which of the two table rows this iteration of the ForEach loop will use. To do this click on the Wizard icon then choose Condition Wizard.
1) When the dialog opens start by changing the "all" to "any" in the very first filter so that it reads "where any of the following conditions are true" This will make the test condition use "or" instead of "and" between the three tests we are going to build.
2) Next "click here to enter a condition" and then "click here to select a node" now click the dropdown and click the plus sign next to varName2 this will expand the ForEach variable so that you can find the title field "varName2.Title". Double click "varName2.Title" and it will fill in that field for you.
3) Then in the value field "click here to set the value" and type in the first title you will be checking for "Vice President, Sales"
Now repeat these steps for the next two titles "Inside Sale Coordinator" and "Sales Manager"
Once you finish building a test for all three titles click the OK button and you will return to the Tag Editor and the query window should look like the following image below.
When the above If tag evaluates True then the first row is used by the ForEach Out tags otherwise the second row is used. The generated output achieved looks like the following: