(در آموزش اصلی به زبان انگلیسی لغت breadcrumb آورده شده که بنده هیچ معادل فارسی برای آن پیدا نکردم. حتی در دیکشنری انگلیسی مایکروسافت هم این لغت وجود ندارد. تیتر اصلی این بخش Adding Breadcrumb Navigation است که من به صورت فوق ترجمه کردهام. خوشحال میشوم اگر دوستان ترجمه بهتری ارائه دهند.)
هدایت سلسله مراتبی، یک رابط کاربری هدایت میباشد که با امکان دسترسی سریع، محل صفحه جاری را در سلسله مراتب سایت نشان میدهد. کنترل SiteMapPath از بستر نقشه سایت برای تعیین محل صفحه در نقشه سایت استفاده کرده و سپس آن را نمایش میدهد.
کدهای زیر را به Master Page اضافه کنید:
<div id="header">
<span class="title">User Account Tutorials</span><br />
<span class="breadcrumb">
<asp:SiteMapPath ID="SiteMapPath1" runat="server">
</asp:SiteMapPath>
</span>
</div>
برای ایجاد این رابط، کدهای زیر را در ستون سمت چپ صفحه Site.master به جای متن TODO: Menu will go here … قرار دهید:
<ul>
<li>
<asp:HyperLink runat="server" ID="lnkHome" NavigateUrl="~/Default.aspx">Home</asp:HyperLink>
</li>
<asp:Repeater runat="server" ID="menu" DataSourceID="SiteMapDataSource1">
<ItemTemplate>
<li>
<asp:HyperLink ID="lnkMenuItem" runat="server" NavigateUrl='<%# Eval("Url") %>'><%# Eval("Title") %></asp:HyperLink>
<asp:Repeater ID="submenu" runat="server" DataSource="<%# ((SiteMapNode) Container.DataItem).ChildNodes %>">
<HeaderTemplate>
<ul>
</HeaderTemplate>
<ItemTemplate>
<li>
<asp:HyperLink ID="lnkMenuItem" runat="server" NavigateUrl='<%# Eval("Url") %>'><%# Eval("Title") %></asp:HyperLink>
</li>
</ItemTemplate>
<FooterTemplate>
</ul>
</FooterTemplate>
</asp:Repeater>
</li>
</ItemTemplate>
</asp:Repeater>
</ul>
<asp:SiteMapDataSource ID="SiteMapDataSource1" runat="server" ShowStartingNode="false" />
کدهای بالا، یک کنترل Repeater به نام menu را به یک SiteMapDataSource؛ که سلسله مراتب تعیین شده نقشه سایت در Web.sitemap را برمیگرداند؛ متصل میکنند. اگر ویژگی ShowStartingNode در SiteMapDataSource برابر False قرار داده شده باشد، فرزندان گره Home را برمیگرداند. Repeater هر کدام از این گرهها را درون یک عنصر <li> نمایش میدهد. Repeater درونی، فرزندان گره جاری را درون یک لیست بدون ترتیب درونی نمایش میدهد.
نتیجه کدهای بالا باید مطابق شکل زیر باشد:
ASP.NET کنترلهایی برای طراحی رابط هدایت کاربران دارد. مانند: Menu, TreeView و SiteMapPath. کنترل های Menu و TreeView ساختار نقشه سایت را براساس منو و نمایش درختی ارائه میدهند، SiteMapPath به شما نشان میدهد که در سلسله مراتب سایت، کجا هستید. دادههای نقشه سایت میتواند توسط کنترلهای دیگر نیز استفاده شود؛ مانند SiteMapDataSource؛ و میتوان توسط برنامهنویسی به آنها دسترسی داشت.