Select A-Z from a list

Question

I have a list of items and would like to give the user the option of jumping to the letter they want.

For example, the letters A-Z along the top of the screen, when the user clicks on B, it takes them to the part of the list with the first item beginning with B.

Is there any way to do this using ColdFusion?

My list is populated using a query.

<table border="1"> 
  <tr> 
    <th>Names</th> 
    <th>Other Stuff</th> 
  </tr> 

<cfoutput query="getnames"> 
  <tr> 
    <td> 
      <li>#getnames.names#</li> 
    </td> 
    <td> 
    <li>#getnames.otherstuff#</li> 
    </td> 
  </tr> 
</cfoutput>
</table>

Answer 1

You would use named anchors to jump to a location in your page. Say you were jumping to a person's last name.

<cfset letters = "A,B,C,D,E,F,G,H,I,J,K,L,M,N,O,P,Q,R,S,T,U,V,W,X,Y,Z">
<cfoutput>
    <cfloop list="#letters#" index="i">
        <a href="###i#">#i#</a>&nbsp;
    </cfloop>
</cfoutput>

<cfset currentLetter = left(yourQuery.lastName,1)>
<cfoutput query = "yourQuery">
    <cfif currentLetter neq left(yourQuery.lastName,1)>
        <cfset currentLetter = left(yourQuery.lastName,1)>
        <a name = "#currentLetter#" />
    </cfif>
    #yourQuery.lastName#<br />
</cfoutput>