How to customize the user control for only one page of the ASP.NET website?

Question

I have two user controls (ascx); one contains some forms, and the other one contains the menu bar.

I used both of them in many pages. Now, I need to customize the one that has the menu bar for the Admin Homepage. So, is it possible to add some changes to the user control just for this page.

I mean by changes, adding two elements to the menu bar.

For instance, let us assume that the two pages are called: Admin, Settings. How will you customize the user control for them?

My code for the Menu User Control (ascx file):

<div class="topnav">
            <ul class="menu" runat="server" >
                <li><a href="Default.aspx">Home</a></li>
                <li><a href="#">Sub-Menu1</a>
                    <ul>
                        <li><a href="#">Item</a></li>
                        <li><a href="#">Item</a></li>
                        <li><a href="#">Item</a></li>
            <li><a href="#">Item</a></li>
                    </ul>
                </li>
                <li><a href="#x">Sub-Menu2</a>
                    <ul>        
                        <li><a href="#">Item</a></li>
                        <li><a href="#">Item</a></li>
                        <li><a href="#">Item</a></li>
                        <li><a href="#">Item</a></li>
                        <li><a href="#">Item </a></li>
                        <li><a href="#">Item</a></li>
                        <li><a href="#">Item</a></li>
                    </ul>
                </li>
                <li><a href="#">ITEM</a></li>
                <li><a href="About.aspx">About</a></li>
                <li><a href="Contact.aspx">Contact Us</a></li>
                <li><a href="#">Help</a></li>
                <li class="menuItem1ToHide"><a href="#">Admin</a></li>
            </ul>
            <div class="clr"></div>
          </div>

And inside the Master Page, I put:

<uc1:MenuBar ID="MenuBar1" runat="server" />

As you see from above code, I added the Admin page as the last element in the list, and the code-behind class, I added the bool method mentioned below, but I don't know how to make the last element only visible for the Admin rather than the other users

By the way, I am using the ASP.NET Role-Based Security since I am using the Windows Authentication. This to define the Admin from the Normal User.

Answer 1

Sure,

Add the two items to the menu bar, and hide them for everything but the admin page. You can do that in several ways; check the URL of the current request, or add a property to the user control (default the menu items to false).

public bool DisplayAdminOnlyMenuItems
{
  get { return menuItem1ToHide.Visible; }
  set
  {
     menuItem1ToHide.Visible = value;
     menuItem2ToHide.Visible = value;
  }
}

or you can use a method to do it. The property allows you to set it in markup or code. For instance, if your UC definition was this:

<uc:Menu ID="ucMenu" runat="server" />

You can set it, for the admin page, this way:

<uc:Menu ID="ucMenu" runat="server" DisplayAdminOnlyMenuItems="True" />

And then it will make those menu items visible.

EDIT : In your case, since everything is role security, add runat="server" to the LI to show or hide:

<li id="liAdmin" runat="server" class="menuItem1ToHide"><a href="#">Admin</a></li>

In your code, on prerender of the user control, do:

protected override void OnPreRender(EventArgs e)
{
    liAdmin.Visible = this.User.IsInRole("Admin");
    //if visible isn't available, use style["display"] = (this.User.IsInRole("Admin") ? "" : "none";
}

Something like that.

Answer 2

您可以检查ascx的Page_Load中的URL并在那里进行更改

Answer 3

Add the new elements to the user control and expose a property (say bool ShowAdminMenuItems ) in the control. Show/hide the new elements based on this property's value. Set this property as true in the page where you need these two menu items to show up. Rest of the pages don't know about it, so they would not set it and the default value (false) would be in affect.

Answer 4

Yes, you can render some elements conditionally by doing:

<% if( somecondition) { %>
<li class="yourclass"> text here </li>
<%}%>