ComponentOne Wijmo Open for Juice UI
Wijmo Open for Juice UI Extender Controls / WijMenu / WijMenu Task-Based Help / Using Menu Templates
In This Topic
    Using Menu Templates
    In This Topic

    The WijMenu control supports using templates for menu items. In this topic, you will create a menu using a template.

    1. Create an ASP.NET Web application with a ScriptManager control and install Juice UI and the Wijmo Juice libraries to your project via NuGet.
    2. Add a standard Panel control to the main content of your page.
    3. Add the following markup within the <asp:Panel> tags to create a list that will become the menu.
      <ul id="menu1">
      
         <li><a href="#">MenuItem</a></li>
      
         <li><a href="#">Breaking News</a>
      
             <ul>
      
             <li class="header">
      
             </li>
      
             <li class="header">
      
             </li>
      
             </ul>
      
             </li>
      
    4. Add the following markup within the first set of  <li class="header"> tags.
      <Template>
      
      <div>
      
            <a href="#" class="wijmo-wijmenu-text">New</a><span class="wijmo-wijmenu-icon-right">Ctrl+N</span>
      
            </div>
      
            </Template>
      
    5. Add the following markup within the second set of <li class="header"> tags.
      <Template>
      
      <div>
      
            <a href="#" class="wijmo-wijmenu-text">Close</a><span class="wijmo-wijmenu-icon-right">Ctrl+C</span>
      
            </div>
      
            </Template>
      
    6. Press F5 to run your application. The menu should resemble the following image.