NlsMenu supports loading menu from XML file or XML string. The xml defines the menu structure and configuration.

1. Create the XML File/String

Below is the basic XML file skeleton for the NlsMenu

        
          <menumgr id="mgr" flowoverformelement="false" defaulteffect="fade" icpath="img/" memorizesel="false">
            <menubar id="menubar" orient="H" showicon="false" showsubicon="false" target="" stlprf="">
              <items>
                <item id="1" url="" ico="" enb="true" title="" subid="computer" subposadj="[-1,0]">Computer</item>
                <item id="2" url="" ico="" enb="true" title="" subid="networking">Networking</item>
                <item id="3" url="" ico="" enb="true" title="" subid="software">Software</item>
                <item id="4" url="" ico="" enb="true" title="" subid="accessories">Accessories</item>
              </items>
            </menubar>
            <menus>
              <menu id="computer" orient="V" showicon="true" showsubicon="false" target="" stlprf="vert_" >
                <items>
                  <item id="1" url="" ico="['smallarr.gif']" enb="true" title="" >Workstation/Desktop</item>
                  <item id="2" url="" ico="['smallarr.gif']" enb="true" title="" subid="server" subposadj="[0,-1]">Server</item>
                  <item id="3" url="" ico="['smallarr.gif']" enb="true" title="" >Notebook</item>
                  <separator />
                  <item id="4" url="" ico="['smallarr.gif']" enb="true" title="" >Apple MAC</item>
                </items>
              </menu>
              <menu id="server" orient="V" showicon="true" showsubicon="false" target="" stlprf="vert_">
                <items>
                  <item id="1" url="" ico="['smallarr.gif']" enb="true" title="" >IBM</item>
                  <item id="2" url="" ico="['smallarr.gif']" enb="true" title="" >Hewlett Packard</item>
                  <item id="3" url="" ico="['smallarr.gif']" enb="true" title="" >Dell</item>
                  <item id="4" url="" ico="['smallarr.gif']" enb="true" title="" >Sun</item>
                </items>
              </menu>
              
              <!--repeat of submenu-->
              <menu>
                ....
              </menu>
              <menu>
                ....
              </menu>
              ...
            </menus>
          </menumgr>

        

The top level element (document root) is <menumgr> tag. Inside the <menumgr>, you can define <menubar> and <menus>, and inside <menus> you can define many submenus with <menu> tag. To define menu item use <item> tag. Click here for the sample XML file.

Below are the detail of the tags and its attributes:

• <menumgr>

  The root element, this element represent the NlsMenuManager object. The attributes are:

  • id, the id of the menu manager object.
  • flowoverformelement, flow over form elements or ActiveX object. The value is true/false.
  • defaulteffect, default effect. Refer to NlsMenu Effect for possible value of effect.
  • memorizesel, true to enable selection path.
  • icpath, the icon path.

  Note that all attributes must be in lower case and the value must be quoted for example: defaulteffect="fade".

• <menubar>

  Defines the menubar. This element must be declared inside <menumgr>. This element represent NlsMenu object.

  • id, the id of the menu
  • orient, defines the orientation of the menu, possible value is "V" or "H".
  • showicon, show menu item icon, true/false.
  • showsubicon, show submenu pointer icon, true/false.
  • target, menu level target, can be _blank, _self, _top or frame name.
  • stlprf, style prefix.
  • submenuic, custom submenu pointer icon.
  • icpath, menu level icon path, override the manager level icon path.
  • itemspc, item space, for example: "1px", "3px".
  
  
• <menus>

  Defines collection of menu (submenus). There is no attribute in this element.

• <menu>

  Defines menu/submenus. This element must be declared inside <menus> tag. This element represent NlsMenu object. Please see <menubar> for attributes list.

• <item>

  Defines menu item. This element must be declared inside <menu> or <menubar> tag. This element represent NlsMenuItem object. The attributes are:

  • id, the id of the menu item.
  • url, specifies menu item url.
  • ico, specifies icon, the format is "[normalicon.gif', 'overicon.gif', 'disableicon.gif']".
  • enb, enable/disable item, true/false
  • title, tooltip text.
  • subid, submenu id.
  • suburl, submenu url. This attribute is used only when you use AJAX menu. Please refer to AJAX menu for more detail.
  • crsframe, true to enable cross frame menu.
  • subframe, associate frame name.
  • subpos, submenu posistion, to be used in cross frame menu only.
  • subposadj, submenu position adjustment, for example: "[10, 10]"
  • subdir, submenu direction, for example: "['right', 'up']"
  • Text between <item> tag will be menu item text. For example <item ...>Products</item>.
  
  
• <separator>

  Defines the menu item separator. There is no attribute in this element.

Note that all the attributes are described in detail in NlsMenu Options.

2. Includes the required script nlsmenuext_xml.js.

All the NlsMenu XML functions are defined in nlsmenuext_xml.js file. You have to include this script file when working with XML.

          
          <head>
            <script language="javascript" src="lib/nlsmenuext_xml.js"></script>
          </head>
        

3. Load the Menu

You need to define a container element for the menu for example a <div id="xmlMenuDiv">. Assign an id for the div and then call NlsMenuUtil.loadFromXMLFile passing the xml file name and the id of the container element.

          
          <div id="xmlMenuDiv"><span style="font-size:7pt;color:#990000">Loading menu...</span></div>
          <script>
            NlsMenuUtil.loadFromXMLFile("menu.xml", "xmlMenuDiv");
          </script>        
        

For more information about NlsMenu XML function, please see Reference.

For complete working example of loading menu from XML, please see the "Load Menu from XML" example.