Drop down box with list of subpages

This TypoScript code snippet shows how to fill a drop down box with a list of subpages using a menu function.

With the TypoScript menu functions, you can do much more than just automatically generate simple text- or graphics-based navigations. To give you an example, we show you how you can generate a drop down box (selection box) that contains a list of page titles. To do so, all you need to do is to wrap each list items in a special way.

Fill a drop down box with subpages TypoScript, SETUP section
temp.drop_down_box = COA
temp.drop_down_box {
  10 = HMENU
  10 {
# Special menu type 'directory': Get subpages of the current page
     special = directory
# '123' is the uid of the page, for which the subpages shall be listed in the drop down box
     special.value = 123
# Select box with JavaScript event 'onChange' that enables a jump to the target page, once an entry has been selected in the list
     wrap = <select name="dropdown_navigation" size="1" onChange="document.location.href='index.php?id=' + this.value">|</select>
     1 = TMENU
     1 {
       expAll = 1
       noBlur = 1
       NO {
# 'value' holds the uid of the page in the list (is later appended to the target URL above)
         stdWrap.dataWrap = <option value="{field:uid}">
         allWrap = |</option>
# Don't wrap the items in link tags
         doNotLinkIt = 1
# Inherit the 'allWrap' and 'doNotLinkIt' settings from the NO part
       CUR < .NO
       CUR = 1
       CUR {
# If we're on the current page, mark this list entry as 'selected'
         stdWrap.dataWrap = <option value="{field:uid}" selected="selected">

This example generates a select box that contains all pages that are located one level below a given page in the page tree. A JavaScript event handler onChange handles the selection by transferring the user to the selected page. If this menu function is displayed on the current browser page, the selected attribute is added to the current item in the drop down box.