Menus are mostly mandatory in the web applications to allow the user to select
their choices. There were so many menu controls available in this web world.
Javascript Menus, Asp.Net In Built menu, Customized Menu & etc are available.
Each one has some drawbacks in it. For example in Javascript menu it will be
difficult to load the menus from the database. Because mostly menu items are
stored in the table to maintain the parent child hierarchy and to apply the
roles based menus.
In ASP.NET menu control, it will be difficult to apply the styles, since the
control will be rendered as HTML tables. There were other issues like losing the
focus in asp.net menus.
What enhancement are done in ASP.NET 4.0 Menu Control?
In single word we can say it as a Table Less Menu Control. In .NET 4, menu
control can be rendered as Unordered List and List Items instead of HTML table.
So what is the advantage of rendering the menu control into unordered list and
list items?
- Applying CSS styles will be pretty much
easier
- Number of lines will get reduced, surely
that will decrease the page content and its size
- Rendering will be very much faster when
compared with HTML tables
- Menu controls render markup will be
semantically correct and compliant with accessibility guidelines
Example:
1. Just drag and drop the menu control from the tool box, it will be generated
like this in the aspx page.
<asp:Menu ID="Menu1" runat="server" RenderingMode="List">
<Items> <asp:MenuItem Text="Home" Value="Home" />
<asp:MenuItem Text="About" Value="About" />
</Items>
</asp:Menu>
2. When you execute the page by hitting F5, this control will be rendered as
below. Like Unordered list and the list items.
<div id="Menu1">
<ul>
<li><a href="#" onclick="...">Home</a></li>
<li><a href="#" onclick="...">About</a></li>
</ul>
</div>
There will be a property called RenderingMode, it can be set to either a Table
or List, that will make the control to render it as HTML table or UnOrderedList.