Loading menus based on Users Role

Question

Hi All,

 

I have used the html for menu creation and I want to load the menu based on the values of the users.How can do that?

 

I want to show and Hide the menu items based on the values.

 

Kindly guide me in this.

 

Menu design:

<div id="sidebar" class="nav-collapse ">

<ul class="sidebar-menu">

<li class="active">

<a class="" href="Dashboard.aspx">

<i class="icon_house_alt">

</i>

<span>Dashboard</span>

</a>

</li>

<li class="sub-menu">

<a href="javascript:;" class="">

<i class="icon_document_alt"></i>

<span>Company</span>

<span class="menu-arrow arrow_carrot-right"></span>

</a>

<ul class="sub">

<li><a class="" href="ADDCompany.aspx">Add Company</a></li>

<li><a class="" href="form_validation.html">Company List</a></li>

</ul>

</li>

<li class="sub-menu">

<a href="javascript:;" class="">

<i class="icon_desktop"></i>

<span>Invoice</span>

<span class="menu-arrow arrow_carrot-right"></span>

</a>

<ul class="sub">

<li><a class="" href="general.html">Invoice Activation</a></li>

<li><a class="" href="buttons.html">Test Link</a></li>

</ul>

</li>

<!-- <li>

<a class="" href="chart-chartjs.html">

<i class="icon_piechart"></i>

<span>Charts</span>

</a>

</li>-->

<li class="sub-menu">

<a href="javascript:;" class="">

<i class="icon_table"></i>

<span>Tables</span>

<span class="menu-arrow arrow_carrot-right"></span>

</a>

<ul class="sub">

<li><a class="" href="basic_table.html">Basic Table</a></li>

</ul>

</li>

<li class="sub-menu">

<a href="javascript:;" class="">

<i class="icon_documents_alt"></i>

<span>Users</span>

<span class="menu-arrow arrow_carrot-right"></span>

</a>

<ul class="sub">

<li><a class="" href="profile.html">User Master</a></li>

<li><a class="" href="login.html"><span>User View</span></a></li>

<li><a class="" href="contact.html"><span>Branchwise UserList</span></a></li>

</ul>

</li>

</ul>

<!-- sidebar menu end-->

</div>

<!--sidebar end-->

<section id="main-content">

<section class="wrapper">

<div>

<asp:ContentPlaceHolder ID="ContentPlaceHolder1" runat="server">

</asp:ContentPlaceHolder>

</div>

</div>

</div>

 

I have used this code in Master page.

suggest me .

Thanks in advance ..