1. Введение
Любой веб-сайт, состоящий из нескольких страниц, требует определенного навигационного пользовательского интерфейса, который создается в два этапа. Сначала должна быть определена логическая структура сайта, затем добавляются элементы пользовательского интерфейса, позволяющие пользователям перемещаться между различными частями структуры сайта. До ASP.NET 2.0 разработчикам приходилось самостоятельно решать эти две проблемы. Однако, начиная с версии 2.0, ASP.NET предоставляет простой способ определения структуры сайта и включает ряд веб-элементов управления, специально предназначенных для отображения пользовательского интерфейса навигации по сайту.
В предыдущей статье мы проанализировали, как создать XML-файл карты сайта Web.sitemap с помощью веб-элементов управления навигацией и как отобразить информацию о навигации по сайту, которая включает в себя:
· SiteMapPath, который отображает навигационную цепочку (Home>Electronics>XBOX)
·TreeView, который Отображает складное вертикально отображаемое дерево, используемое для отображения всей иерархии карты сайта
. Меню, которое отображает горизонтально или вертикально выровненное меню.
В предыдущей статье были представлены только функции и возможности для файла карты сайта и веб-элемента управления навигацией. . В этом разделе мы обратим внимание на программное управление информацией карты сайта и подробно рассмотрим веб-элемент управления навигацией SiteMapPath.
2. Карта сайта
В примерах в этой статье используется карта сайта, созданная в первой части. Вы можете увидеть точный синтаксис XML-файла карты сайта в части 1 или загрузить его в конце этой статьи. Графическое представление структуры сайта, используемой в этих примерах, показано ниже:
3. Карта сайта, управляемая программно.
Карта сайта — это набор связанных узлов карты сайта. Обычно каждый узел карты сайта содержит заголовок, URL-адрес и описание. Изображение, показанное выше, является примером карты сайта, где каждый прямоугольник представляет собой узел карты сайта. ASP.NET не требует определенного формата для указания карт сайта, хотя по умолчанию предоставляет возможность использования файла формата XML. (Подробную информацию о файлах XML см. в части 1.)
ASP.NET предоставляет класс SiteMap, который обеспечивает программный доступ только для чтения к карте сайта. Этот класс используется внутри двух элементов управления, которые мы проанализируем позже в этой статье:
SiteMapPath — создает навигационную цепочку на основе местоположения посещенной страницы и ее структуры сайта. В частности, SiteMapPath начинается с узла, возвращаемого свойством SiteMap.CurrentNode, и проходит вверх по иерархии до корня.
· SiteMapDataSource — этот элемент управления создает иерархический источник данных — он отображает структуру карты сайта. Чтобы отобразить информацию о карте сайта в другом веб-элементе управления, таком как TreeView или Menu, веб-элемент управления не запрашивает карту сайта напрямую, а привязывается к элементу управления SiteMapDataSource, который отвечает за чтение структуры карты сайта;
Класс SiteMap имеет два свойства: RootNode и CurrentNode. Оба свойства возвращают экземпляры SiteMapNode. Класс SiteMapNode представляет узел, определенный на карте сайта, и имеет свойства, описывающие узел — Title, Url и Description, а также свойства, которые программно управляют иерархией — ParentNode, ChildNodes, NextSibling, previousSibling и т. д.
Вы можете использовать класс SiteMap на своих собственных страницах ASP.NET. Например, мы можем отображать ссылки «Далее», «Предыдущий» и «Вверх» на каждой странице — просто добавив три элемента управления HyperLink на главную страницу сайта, а также немного программируя, чтобы проверить, имеет ли CurrentNode NextSibling, previousSibling или ParentNode. В частности, вы добавите на свою главную страницу следующую разметку:
[<asp:HyperLink ID="lnkPrev" runat="server">Prev</asp:HyperLink>] |
[<asp:HyperLink ID="lnkUp" runat="server">Вверх</asp:HyperLink>] |
[<asp:HyperLink ID="lnkNext" runat="server">Далее</asp:HyperLink>]
Обработчик событий Page_Load главной страницы выглядит следующим образом:
Если SiteMap.CurrentNode IsNot Nothing Тогда
'Установить следующую/предыдущую/вверх ссылкуIf SiteMap.CurrentNode.PreviousSibling IsNot Nothing then
lnkPrev.NavigateUrl = SiteMap.CurrentNode.PreviousSibling.Url
lnkPrev.Text = "< Prev (" & SiteMap.CurrentNode.PreviousSibling.Title & ")"
Еще
lnkPrev.NavigateUrl = String.Empty
lnkPrev.Text = "< Предыдущая"
Конец, если
Если SiteMap.CurrentNode.ParentNode не является ничем, тогда
lnkUp.NavigateUrl = SiteMap.CurrentNode.ParentNode.Url
lnkUp.Text = "Вверх (" & SiteMap.CurrentNode.ParentNode.Title & ")"
Еще
lnkUp.NavigateUrl = String.Empty
lnkUp.Text = "Вверх"
Конец, если
Если SiteMap.CurrentNode.NextSibling IsNot Nothing, тогда
lnkNext.NavigateUrl = SiteMap.CurrentNode.NextSibling.Url
lnkNext.Text = "(" & SiteMap.CurrentNode.NextSibling.Title & ") Далее >"
Еще
lnkNext.NavigateUrl = String.Empty
lnkNext.Text = "Далее >"
Конец, если
End If.
Это добавит три гиперссылки «Далее», «Вверх» и «Предыдущий» на каждую страницу, которая наследуется от главной страницы, см. снимок экрана ниже.
4. Используйте элемент управления SiteMapPath для отображения навигационной цепочки.
Элемент управления SiteMapPath отображает навигационную цепочку — он используется, чтобы показать пользователям, где они находятся в структуре сайта. Выходные данные элемента управления SiteMapPath определяются следующими тремя факторами:
структура сайта, определенная картой сайта,
посещаемая страница и
значения свойств элемента управления SiteMapPath.
Когда страница с. осуществляется доступ к элементу управления SiteMapPath, элемент управления SiteMapPath пытается преобразовать URL-адрес страницы в значение URL-адреса узла карты сайта, определенного в карте сайта. Если совпадение найдено, элемент управления пройдет структуру до корня и выдаст следующий результат: RootNode>ParentNode>...>ParentNode>CurrentNode. CurrentNode здесь — это заголовок узла карты сайта — он используется для сопоставления URL-адреса запроса текущей страницы; RootNode и ParentNodes генерируются как гиперссылки, если узел карты сайта имеет значение URL, определенное в карте сайта. Элемент управления SiteMapPath на странице «Книги истории» (Books/History.aspx) создаст «Главную»> «Книги»> «История», а также создаст «Главную» и «Книги» в виде гиперссылок, указывающих на Default.aspx и Books/Default.aspx соответственно. . При доступе к Books/Default.aspx SiteMapPath создает Home>Books.
Чтобы внести ясность, вывод SiteMapPath зависит как от самой карты сайта, так и от посещаемой страницы. Вывод SiteMapPath можно настроить с помощью свойств этого элемента управления. В стандартном формате веб-элемента управления есть некоторые свойства — BackColor, Font, ForeColor и т. д., а также некоторые параметры, специфичные для SiteMapPath, в том числе:
PathDirection — может принимать одно из двух значений: RootToCurrent (по умолчанию) или CurrentToRoot. Если значение равно RootToCurrent, навигационная цепочка на странице «Книги по истории» создается как Главная>Книги>История; если значение равно CurrentToRoot, выходные данные будут: История>Книги>Главная.
·PathSeparator — указывает строку, используемую для разделения каждого узла в навигационной цепочке; значение по умолчанию — >
·RenderCurrentNodeAsLink — логический атрибут — он указывает, должен ли CurrentNode создаваться как ссылка; значение по умолчанию — False;
·ParentLevelsDisplayed — целочисленное значение — его можно использовать для ограничения высоты древовидной структуры, отображаемой навигационной цепочкой. По умолчанию значение этого атрибута равно -1, что означает отсутствие ограничений; установка значения 1 приведет к созданию навигационной цепочки Книги>История на странице «Книги по истории». Корень не включен, поскольку элемент управления SiteMapPath перемещается только до одного родительского элемента — от «Истории» до «Книги».
· ShowToolTips — если узел карты сайта имеет значение описания, то описание отображается в виде текста всплывающей подсказки для каждого узла навигации, если для этого свойства установлено значение True (по умолчанию).
Существуют также свойства стиля, которые можно использовать для установки BackColor, Font, ForeColor и т. д. — для различных частей элемента управления SiteMapPath. Вы можете использовать свойство NodeStyle для настройки внешнего вида узлов в навигационной цепочке. Вы можете использовать RootNodeStyle и CurrentNodeStyle для дальнейшей настройки первого и последнего узлов в навигационной цепочке; Как правило, самый простой и наиболее эстетичный способ форматирования элемента управления SiteMapPath — использовать мастер «Автоматическое форматирование» — его можно включить с помощью чувствительного тега элемента управления.
5. Настройте сгенерированный вывод с помощью шаблонов.
SiteMapPath содержит четыре шаблона, которые позволяют осуществлять дальнейшую настройку сгенерированного вывода. Шаблоны позволяют сочетать статическую разметку HTML, веб-элементы управления и синтаксис привязки данных. Если вы раньше использовали элементы управления DataList или Повторитель, вы уже знакомы с шаблонами. Шаблоны в ASP.NET 2.0 в основном такие же, как и в ASP.NET 1.x, за исключением того, что в ASP.NET 2.0 представлен новый, более краткий синтаксис для выражений привязки данных. Например, в ASP.NET 1.x необходимо использовать синтаксис <%# DataBinder.Eval(Container.DataItem, PropertyName) %>, чтобы получить значение столбца. В ASP.NET 2.0 этот старый синтаксис по-прежнему можно использовать, но при необходимости можно использовать более короткую версию <%# Eval(PropertyName) %>.
По умолчанию SiteMapPath создает корневые и родительские узлы как обычные гиперссылки, чтобы пользователи, щелкнув ссылку, могли быстро вернуться вверх по иерархическому дереву элементов управления. Однако вам может потребоваться выполнить некоторую обработку на стороне сервера перед отправкой информации обратно пользователю — возможно, вы хотите записать, куда движется пользователь, или автоматически сохранять любые изменения, которые он вносит на страницу. Этого можно добиться, используя шаблон и создав узел как LinkButton.
Например, если вы хотите создать только корневой узел SiteMapPath как LinkButton, вы можете использовать следующий тег для добавления <RootNodeTemplate> к элементу управления SiteMapPath:
<asp:SiteMapPath ID="SiteMapPath1" runat="server" >
<RootNodeTemplate>
<asp:LinkButton ID="LinkButton1" runat="server"
Text='<%# Eval("title") %>'
CommandArgument='<%# Eval("url") %>'
OnCommand="LinkButton1_Command">
</asp:LinkButton>
</RootNodeTemplate>
</asp:SiteMapPath>
Этот тег добавляет элемент управления LinkButton к SiteMapPath — его свойство Text назначается свойству Title соответствующего узла SiteMapNode. При нажатии LinkButton вызывается обратная передача и срабатывает событие Command элемента управления — это активирует обработчик событий LinkButton1_Command. Свойство Url SiteMapNode передается этому обработчику событий через свойство CommandArgument. В этом обработчике событий вы можете выполнить любую необходимую обработку на стороне сервера, а затем направить пользователя на запрошенную страницу через Response.Redirect(e.CommandArgument).