TYPO3

Drop down box with list of subpages

deutsch Hier klicken, um diese Seite auf Deutsch zu lesen: Auswahlliste mit Liste von Unterseiten

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.

TypoScript: Fill a drop down box with subpages

SETUP
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 onChange event handler 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 (CUR) in the drop down box.

Comments for Drop down box with list of subpages

Add a comment


(will not be displayed)


(Fields marked with a * are mandatory)
Please note that your comment will be checked before it gets published.
Latest TYPO3 tutorial
How to define special links with custom tags

How to define special links with custom tags

September 2010 – How you can define your own tags for specific links in TYPO3. We show tags for nofollow links, links to other languages and links to tt_news records. more »

Latest TypoScript snippet
Automated backlink to parent page

Automated backlink to parent page

December 2009 – How to automatically generate a back link to a page one level above the current page. more »

Latest glossary entry
File browsers in TYPO3

File browsers in TYPO3

March 2010 – What are file browsers in TYPO3 and how can they be used? more »