Building a sub-page dropdown with TYPO3

Written byBy: Mario Rimann.

The following TypoScript renders a SELECT drop-down with subpages. The output is valid XHTML 1.0 strict. To jump to the page a user selects, a little Java Script is needed (see below).

temp.menuDropDown = HMENU
temp.menuDropDown {
    special = directory
    special.value = 7
    1 = TMENU
    1 {
        wrap = <select name="selection" onchange="javascript:countryRedirect();">|</select>
        noBlur = 1
        NO = 1
        NO {
            doNotLinkIt = 1
            stdWrap {
                typolink {
                    parameter.data = field:uid
                    returnLast = url
                }
                wrap = <option value=" | ">
                dataWrap = |{field:title}</option>
            }
        }
        ACT = 1
        ACT {
            doNotLinkIt = 1
            stdWrap {
                typolink {
                    parameter.data = field:uid
                    returnLast = url
                }
                wrap = <option value=" | " selected="selected">
                dataWrap = |{field:title}</option>
            }
        }
    }
}

And here's the JavaScript I used:

function countryRedirect() {
    var url=document.getElementById('countrySelect').selection.value
    document.location.href=url
}

I saved the JavaScript stuff in a file called /fileadmin/template/countrySelect.js and loaded this file in my master TS template: