Выделение строки меню в веб-приложении ASP.NET - PullRequest
Новая
       11

Выделение строки меню в веб-приложении ASP.NET

3 голосов
/ 11 мая 2011

Я создал веб-приложение, используя ASP.NET Visual Studio 2010 с мастер-страницами.Как вы увидите, проект предоставляет нам пункт меню по умолчанию.У меня есть 5 страниц (ссылок), перечисленных в этих строках меню.Теперь, когда пользователь заходит на определенную страницу, я хочу выделить эту ссылку в строке меню.Я не знаю, как это сделать: (

Я пробовал это на коде мастер-страницы, но это тоже не сработало: 

 foreach (MenuItem item in NavigationMenu.Items)
        {
            var navigateUrlParams = item.NavigateUrl.Split('/');
            if (Request.Url.AbsoluteUri.IndexOf(navigateUrlParams[navigateUrlParams.Length - 1]) != -1)
            {
                item.Selected = true;
            }
        }

И в моем представлении разметки у меня есть это: 

 <div class="clear hideSkiplink">
            <asp:Menu ID="NavigationMenu" runat="server" CssClass="menu" EnableViewState="false" IncludeStyleBlock="false" Orientation="Horizontal"  OnMenuItemClick="NavigationMenu_MenuItemClick">
                <Items>
                    <asp:MenuItem Text="Test1"/>
                     <asp:MenuItem Text="Test2"/>
                     <asp:MenuItem  Text="Test3"/>

                </Items>
            </asp:Menu>
        </div>

Поэтому, в основном, когда пользователь заходит на страницу Test1.aspx, я хочу выделить пункт меню Test1. Как мне это сделать?

Любая помощь будет оценена! Спасибо...

Ответы [ 2 ]

0 голосов
/ 12 мая 2011

Сначала убедитесь, что все пункты меню имеют свойство Id

В коде вашей главной страницы на странице обработчик загрузки выполните что-то вроде этого 

if (!Page.IsPostBack)
{
      if(Page is Default)
           liHome.Attributes["class"] += " active";

}

В этом примере вы должны проверить «тип» просматриваемой в данный момент страницы и добавить атрибут класса к текущей просматриваемой ссылке. Вы можете определить свойство css для active что-то вроде 

.active
{
    background-color: Red;
}
0 голосов
/ 11 мая 2011

Используйте классы ссылок CSS для реализации этого:

http://www.w3schools.com/css/sel_active.asp

И если вам не нужно "что-то делать" программно с этими элементами ссылок, используйте вместо этого якорные ссылки HTML.Создайте их как элементы списка: 

<ul class="menu">
    <li>
        <a href="~/Home" id="link1" title="First Link" runat="server">Link 1</a>
    </li>
</ul>

Я хочу спросить, нужны ли здесь элементы управления (не знакомы с вашим проектом), и сделать разметку простой, когда это возможно.

...