Using Looping

Loops are another fundamental language element supported by most development platforms. Loops do just thatthey loop. Loops provide a mechanism with which to repeat tasks, and ColdFusion supports several types of loops, all via the <cfloop> tag:

Index loops, used to repeat a set number of times
Conditional loops, used to repeat until a specified condition becomes FALSE
Query loops, used to iterate through database query results
List loops, used to iterate through a specified list
Collection loops, used to loop through structures

You won't use all these loop types here, but to acquaint you with <cfloop>, let's look at a few examples.

The Index Loop

One of the most frequently used loops is the index loop, used to loop a set number of times (from a specified value to another specified value). To learn about this loop, you'll generate a simple list (see Figure 9.8). Type the code in Listing 9.11, and save it in 9 as loop1.cfm.

Listing 9.11. `loop1.cfm`

 <!--- Name: loop1.cfm Author: Ben Forta (ben@forta.com) Description: Demonstrate use of <cfloop from to> Created: 12/1/2004 ---> <html> <head>  <title>Loop 1</title> </head> <body> <!--- Start list ---> <ul> <!--- loop from 1 to 10 ---> <cfloop from="1" to="10" index="i">  <!--- Write item --->  <cfoutput><li>Item #i#</li></cfoutput> </cfloop> <!--- end list ---> </ul> </body> </html>

Figure 9.8. Loops can build lists and other display elements automatically.

<cfloop> is used to create a block of code to be executed over and over. The code in Listing 9.11 creates a simple loop that displays a list of numbers in an HTML unordered list from 1 to 10. The HTML unordered list is started before the <cfloop> (you wouldn't want to start it in the loop, because you'd be starting a new list on each iteration) and ends after the </cfloop>. The loop itself is created using the following code:

 <cfloop from="1" to="10" index="i">

In an index loop the from and to values must be specified and the code between <cfloop> and </cfloop> is repeated that many times. Here, from="1" and to="10", so the loop repeats 10 times. Within the loop itself, a variable named in the index attribute contains the current increment, so i will be 1 the first time around, 2 the second time, and so on.

Within the loop, the value of i is displayed in a list item using the following code:

 <cfoutput><li>Item #i#</li></cfoutput>

The first time around, when i is 1, the generated output will be

 <li>Item 1</li>

and on the second loop it will be

 <li>Item 2</li>

and so on.

TIP

Want to loop backwards? You can. Use the step attribute to specify how to count from the from value to the to value. step="-1" makes the count go backward, one number at a time.

The List Loop

List loops are designed to make working with ColdFusion lists simple and error-free. Whether it is lists created by form submissions, manual lists, lists derived from database queries (regardless of the origin), any list (with any delimiter) can be iterated over using <cfloop>.

For an introduction to lists, see Chapter 8.

The following example uses a list created in Chapter 8 and loops through the list displaying one element at a time (see Figure 9.9). Save Listing 9.12 as loop2.cfm.

Listing 9.12. `loop2.cfm`

 <!--- Name: loop2.cfm Author: Ben Forta (ben@forta.com) Description: Demonstrate use of <cfloop list> Created: 12/1/2004 ---> <html> <head>  <title>Loop 2</title> </head> <body> <!--- Create list ---> <cfset fruit="apple,banana,cherry,grape,mango,orange,pineapple"> <!--- Start list ---> <ul> <!--- Loop through list ---> <cfloop list="#fruit#" index="i">  <!--- Write item --->  <cfoutput><li>#i#</li></cfoutput> </cfloop> <!--- end list ---> </ul> </body> </html>

Figure 9.9. Any lists, with any delimiter, can be iterated using `<cfloop>`.

<cfset> is used to create the lista comma-delimited list of fruit. <cfloop> takes the list to be processed in the list attribute, and because list accepts a string, number signs must be used around the variable name fruit.

<cfloop> repeats the loop once for every element in the list. In addition, within the loop, it makes the current element available in the variable specified in the index attributein this example, i. So, i is apple on the first iteration, banana on the second iteration, and so on.

NOTE

Lists also can be looped over using index loops. from="1" to="#ListLen(fruit)#" sets the to and from properly. Within the loop, ListGetAt() can be used to obtain the element.

Nested Loops

Like the <cfif> and <cfswitch> statements, loops can be nested. Nesting loops lets you create extremely powerful code, as long as you are very careful in constructing the loops. Listing 9.13 contains a practical example of nested loops, using three loops to display a table of Web browser-safe colors (seen in Figure 9.10). Save the code as loop3.cfm.

Listing 9.13. `loop3.cfm`

 <!--- Name: loop3.cfm Author: Ben Forta (ben@forta.com) Description: Demonstrate use of nested loops Created: 12/1/2004 ---> <html> <head>  <title>Loop 3</title> </head> <body> <!--- Hex value list ---> <cfset hex="00,33,66,99,CC,FF"> <!--- Create table ---> <table> <!--- Start RR loop ---> <cfloop index="red" list="#hex#">  <!--- Start GG loop --->  <cfloop index="green" list="#hex#">   <tr>   <!--- Start BB loop --->   <cfloop index="blue" list="#hex#">    <!--- Build RGB value --->    <cfset rgb=red&green&blue>    <!--- And display it --->    <cfoutput>    <td bgcolor="###rgb#" width="100" align="center">#rgb#</td>    </cfoutput>   </cfloop>   </tr>  </cfloop> </cfloop> </table> </body> </html>

Figure 9.10. Displaying the Web browser-safe color palette requires the use of three nested loops.

Listing 9.13 warrants explanation. Colors in Web pages are expressed as RGB values (as in red, green, blue). The idea is that by adjusting the amount of red, green, and blue within a color, every possible color can be created. RGB values are specified using hexadecimal notation. Don't panic if you have forgotten base-n arithmeticit's quite simple, actually. The amount of color is specified as a number, from 0 (none) to 255 (all). But instead of 0255, the hexadecimal equivalents (00FF) are used. So, pure red is all red and no green or blue, or FF0000; yellow is all red and green and no blue, or FFFF00.

Still confused? Execute the code and you'll see a complete list of colors and the RGB value for each.

To list all the colors, the code must loop through all possible combinationslist all shades of red, and within each shade of red list each shade of green, and within each shade of green list each shade of blue. In the innermost loop, a variable named rgb is created as follows:

 <cfset rgb=red&green&blue>

On the very first iteration red, green, and blue are all 00, so rgb is 000000. On the next iteration red and green are still 00, but blue is 33, so rgb is 000033. By the time all the loops have been processed, a total of 216 colors have been generated (6 to the power of 3 for you mathematicians out there, because each color has six possible shades as defined in variable hex).

The exact mechanics of RGB value generation aren't important here. The key point is that loops can be nested quite easily and within each loop the counters and variables created at an outer loop are visible and usable.

The Index Loop

Listing 9.11. loop1.cfm