Monday, November 30, 2015

Typoscript to generate SELECT box (option-select) for page tree.

This typoscript below will generate a option select box for page tree or dropdown box for a page tree.
One simple javascript code has been added to make this select box active.
This example below is just an idea. We can easily customize this according to our need.

lib.field_menu_os = HMENU
lib.field_menu_os.entryLevel = 1
lib.field_menu_os {  
     wrap = <select id="menu_option_select" name="menu_option_select" size="1" onChange="javascript:_go_to_page(this.value);" >|</select>
     1 = TMENU
     1 {
       expAll = 1
       noBlur = 1
       NO {      
         stdWrap.dataWrap = <option value="{field:uid}">
         allWrap = |</option>
         doNotLinkIt = 1
       }
       # Inherit the 'allWrap' and 'doNotLinkIt' settings from the NO part
       CUR < .NO
       CUR = 1
       CUR {
         stdWrap.dataWrap = <option value="{field:uid}" selected="selected">
       }
     }
     2 = TMENU
     2 {
       expAll = 1
       noBlur = 1
       NO {
         stdWrap.dataWrap = <option value="{field:uid}">&nbsp;-&nbsp;
         allWrap = |</option>
         doNotLinkIt = 1
       }
       # Inherit the 'allWrap' and 'doNotLinkIt' settings from the NO part
       CUR < .NO
       CUR = 1
       CUR {
         stdWrap.dataWrap = <option value="{field:uid}" selected="selected">&nbsp;-&nbsp;
       }
     }
     3 = TMENU
     3 {
       expAll = 1
       noBlur = 1
       NO {
         stdWrap.dataWrap = <option value="{field:uid}">&nbsp;&nbsp;-&nbsp;&nbsp;
         allWrap = |</option>
         doNotLinkIt = 1
       }
       # Inherit the 'allWrap' and 'doNotLinkIt' settings from the NO part
       CUR < .NO
       CUR = 1
       CUR {
         stdWrap.dataWrap = <option value="{field:uid}" selected="selected">&nbsp;&nbsp;-&nbsp;&nbsp;
       }
     }    
  }

Simple one line of javascript will do the job easily. We can take help of jQuery too.
      function _go_to_page(selected_page_id){
  document.location.href='index.php?id='+selected_page_id;
 }