(Sitecore)带有子导航的导航 [英] (Sitecore) Navigation with Subnavigation

问题描述

我正在尝试使用下拉子导航菜单锚点构建主导航.我已经准备好了带有CSS的HTML，但是我不知道如何在子布局及其后面的代码中实现它.

I'm trying to build main navigation with drop down subnavigation menu anchors. I got the HTML with CSS ready, but I don't know how to do it in the sublayout and its code behind.

我做了很多导航，但是那些都是使用asp:repeaters或asp:ListViews的一维菜单.

I have done a lot of navigations, but those were all 1-dimensional menus using asp:repeaters or asp:ListViews.

有人能指出我正确的方向吗?

Can anyone point me to the right direction?

推荐答案

基本上，您将希望在要在导航上显示的层数(或维度")上嵌套嵌套的中继器.请参见下面的示例.

Essentially you will want to have nested repeaters on the number of levels (or "dimensions") you want to display on your navigation. See an example below.

<asp:Repeater runat="server" ID="TopNavRepeater" OnItemDataBound="TopNavRepeater_OnItemDataBound">
    <ItemTemplate>
        <sc:Link runat="server" ID="sclTopLink" Field="__Display Name" />
        <asp:Repeater runat="server" ID="SecondNavRepeater" OnItemDataBound="SecondNavRepeater_OnItemDataBound">
            <ItemTemplate>
                 <sc:Link runat="server" ID="sclSecondLink" Field="__Display Name" />
            </ItemTemplate>
        </asp:Repeater>
    </ItemTemplate>
</asp:Repeater>

您将希望将每个项目的子级绑定到顶部转发器，并将其绑定到第二个转发器.通过设置OnItemDataBound事件上的项目"和字段"，使用Sitecore链接控件呈现到页面的链接.

You will want to get the children of each Item bound to the Top Repeater and bind it to the second Repeater. Use Sitecore Link Controls to render the links to the pages by settings the Items, and Fields, on the OnItemDataBound event.

请参见下面的粗略示例

protected void Page_Load(object sender, EventArgs e)
{
    TopNavRepeater.DataSource = YourHomeItem.Children();
    TopNavRepeater.DataBind();
}

protected void TopNavRepeater_OnItemDataBound(object sender, RepeaterItemEventArgs e)
{
    if (e.Item.ItemType == ListItemType.Item || e.Item.ItemType == ListItemType.AlternatingItem)
    {
        var item = e.Item.DataItem as Item;
        if (item == null)
            return;

        var sclTopLink = e.Item.FindControl("sclTopLink") as Link;
        var SecondNavRepeater = e.Item.FindControl("SecondNavRepeater") as Repeater;

        if (sclTopLink != null)
        {
            sclTopLink.Item = item;
        }

        if (SecondNavRepeater != null)
        {
            SecondNavRepeater.DataSource = item.Children;
            SecondNavRepeater.DataBind();
        }
    }
}

这篇关于(Sitecore)带有子导航的导航的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！