This sample was created in reference to this thread of discussion in the "Help and Support Version 5".

This Demo Contains Two Types of Select Box Emulation Functions

1. The mm_changeParentText() function emulates a select box within the Milonic Menu.
2. The mm_setSelected() function allows the Milonic Menu to be placed in a form and emulate a select box.

I. To use the changeParentText() function:

1. Place the following code at the top of your menu_data.js file:

   	function changeParentText()
   { 
      _i=getParentItemByItem(_itemRef) 
      _mi[_i][1]=_mi[_itemRef][1] 
       
      _item=gmobj("el"+_i) 
      _item.innerHTML=BDMenu(_mi[_i][0]) 
      itemOn(_i)    
   } 
   

2. Define a menuStyle in your menu_data file. This style will be used by the 'dropdown'. Include the following line: clickfunction="changeParentText();";
   
   
3. Define a mainStyle for the main menu and include the following:
   clickfunction="";
   
   
4. Define your main menu [this will be the 'box'] and include the following in the aI string.
   openonclick=1;closeonclick=1;keepalive=1;");
   
   In this sample the aI string is:
   aI("text=Please Select Your TLD;showmenu=TLD;openonclick=1;closeonclick=1;keepalive=1;");



5. Define your sub menu with the wanted items
6. Place the calls for the menu as you would any menu.

---

II. To use the setSelectBox() function:

In this example the milonic select box is used inside a form. The function changes the text of the select box item and also places the result of the selection into a form field. In the sample, this field is coded as a normal, visible text input field so you can see the field's value change with the selection. In practice, you would set the input type to "hidden". That way, the field isn't seen, but its value is set according to the selection in the pseudo select box. The advantage of doing it this way is that the result of the selection (and any other pseudo select boxes in the form) remains inside of the form and can be easily processed along with other fields in the form.

1. Set up your menu data file as usual. In this sample the file contains the style definitions, the selectBox menu, and the Options menu.



2. Place the following code at the top of your menu_data.js file

   function setSelected() 
   { 
    selectedItem = _itemRef;
      selectedText = _mi[selectedItem][1]; 
      parentItem = getParentItemByItem(selectedItem);
      _mi[parentItem][1] = selectedText;
      BDMenu(_mi[parentItem][0]);
      document.forms['myForm'].selectHolder.value = selectedText;
       menuDisplay(_mi[selectedItem][0], 0);
   }
   

3. Create your form in your html page.
   
   
4. From the menu data file remove the selectBox menu you created and place it in the form within script tags including the drawMenus(); at the end of it. [ the same method as that for placing a menu in a table ]
   The following is the form used in this sample. NOTE the position="relative":
   
   <form name="myForm" onsubmit="showSelectValue()">
   Select:<br>
   <script language="javascript">
   with(milonic=new menuname("selectBox")){
   style=selectStyleMain;
   top=10;
   left=10;
   alwaysvisible=1;
   orientation="horizontal";
   position="relative";
   itemwidth=120;
   aI("text=Select an Option;showmenu=Options;openonclick=1;closeonclick=1;offborder=inset 2px;");
   }
   drawMenus();
   </script>
   
   <input type="submit" value="Submit">
   
   Your Selection:<br>
   <input type="text" name="selectHolder" size="15">
   </form>
   
   

DHTML Menu courtesy of  Milonic Solutions
Download  this example