Select Pages not working in Navigation Widget

Posted by Community Admin on 04-Aug-2018 19:09

Select Pages not working in Navigation Widget

All Replies

Posted by Community Admin on 14-Nov-2013 00:00

I'm making a custom template for the new(in 6.1) navigation widget, which is working fine. But when I try to use the "Custom selection of pages..." radio button in the editor, it is displaying all pages with "Show in Navigation" selected, and it completely ignores what I select in the editor. I'm not sure if I need to do some kind of fluent API query in the template code behind or perhaps I'm using the wrong kind of data source.

Anyway, here is my Template code:

<%@ Control Language="C#" AutoEventWireup="true" CodeBehind="HorizontalNavigation.ascx.cs" Inherits="SitefinityWebApp.CustomTemplates.HorizontalNavigation" %>


<%@ Register Assembly="Telerik.Sitefinity" Namespace="Telerik.Sitefinity.Web.UI.NavigationControls" TagPrefix="navcontrols" %>


<navcontrols:SitefinitySiteMapDataSource runat="server" ID="datasource" />

<div id="custom-navigation">
    <asp:Repeater DataSourceID="datasource" ID="horizontalMenu" runat="server" OnItemDataBound="menuItemDataBound">
        <HeaderTemplate>
            <ul class="main-items">
        </HeaderTemplate>
        <ItemTemplate>
            <li class="main-item">
                <a href="http://<%# HttpContext.Current.Request.Url.Host %><%# Eval("Url").ToString().Substring(1) %>"><%# Eval("Title") %></a>
                <asp:Repeater runat="server" ID="horizontalMenuChildItems">
                    <HeaderTemplate>
                        <div>
                        <ul class="sub-items">
                    </HeaderTemplate>
                    <ItemTemplate>
                        <li class="sub-item">
                            <a href="http://<%# HttpContext.Current.Request.Url.Host %><%# Eval("Url").ToString().Substring(1) %>"><%# Eval("Title") %></a>
                        </li>
                    </ItemTemplate>
                    <FooterTemplate>
                        </ul>
                        </div>
                    </FooterTemplate>
                </asp:Repeater>
            </li>
        </ItemTemplate>
        <FooterTemplate>
            </ul>
        </FooterTemplate>
    </asp:Repeater>
</div>
 
And the menuItemDataBound event handler:

protected void menuItemDataBound(object sender, RepeaterItemEventArgs e)
       
            PageSiteNode node = (PageSiteNode)e.Item.DataItem;
            if (node == null) return;
            if (node.HasChildNodes)
           
                Repeater horizontalMenuChildItems = ((Repeater) e.Item.FindControl("horizontalMenuChildItems"));
                horizontalMenuChildItems.DataSource = node.ChildNodes;
                horizontalMenuChildItems.DataBind();
           
       

Posted by Community Admin on 15-Nov-2013 00:00

Hi Michael,

Thank you for using Sitefinity CMS.
I assume that bind your repeater(s) with SitefinitySiteMapDataSource which is the whole sitemap without any filters applied. That means that you need to apply filters based on the configurations from the control designer on this data source, then bind the repeater(s).

Regards,
Strahil Strahilov
Telerik

Do you want to have your say in the Sitefinity development roadmap? Do you want to know when a feature you requested is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items

Posted by Community Admin on 15-Nov-2013 00:00

Ahh, I see. I've got it working now.

I took the DataSourceId attribute off of the repeater, and then in the  Page_Load event, bound it to the SitefinitySiteMapDataSource.Nodes property. Thank you for your response!

Posted by Community Admin on 03-Aug-2016 00:00

Strahil,

I am having a similar issue too. The 'custom selection of page' option pulls down all the main pages and behaves mostly like the 'Top-level pages' option.  How do I fix it?

Here is my template:

%@ Control Language="C#" %>
<%@ Import Namespace="Telerik.Sitefinity.Web.UI.NavigationControls.Extensions.LightNavigationControlTemplate" %>
<%@ Import Namespace="Telerik.Sitefinity.Web.UI.NavigationControls" %>

<%@ Register Assembly="Telerik.Sitefinity" TagPrefix="navigation" Namespace="Telerik.Sitefinity.Web.UI.NavigationControls" %>
<%@ Register Assembly="Telerik.Sitefinity" TagPrefix="sf" Namespace="Telerik.Sitefinity.Web.UI" %>

<sf:ResourceLinks runat="server" UseEmbeddedThemes="true" Theme="Basic">
    <sf:ResourceFile Name="Telerik.Sitefinity.Resources.Themes.Basic.Styles.nav.widget.css" Static="true" />
    <sf:ResourceFile Name="Telerik.Sitefinity.Resources.Scripts.Kendo.styles.kendo_common_min.css" Static="true" />
    <sf:ResourceFile JavaScriptLibrary="JQuery" />
    <sf:ResourceFile JavaScriptLibrary="KendoAll" />
</sf:ResourceLinks>

<navigation:SitefinitySiteMapDataSource runat="server" ID="dataSource" />

<sf:SitefinityLabel id="title" runat="server" WrapperTagName="div" HideIfNoText="true" HideIfNoTextMode="Server" />
<div class="sfNavWrp sfNavTreeviewWrp data-block <%= this.GetCssClass() %>">
    <%-- responsive design section - renders templates for the responsive design--%>
    <navigation:NavTransformationTemplate runat="server" TransformationName="ToToggleMenu" TemplateName="ToggleMenu" />
    <navigation:NavTransformationTemplate runat="server" TransformationName="ToDropDown" TemplateName="Dropdown" />
    <%-- end of the responsive design section --%>
      

    <ul class="sfNavTreeview sfNavList" runat="server" id="navigationUl">
        <navigation:NavigationContainer runat="server" DataSourceID="dataSource">
            <Templates>
             
                  <navigation:NavigationTemplate>
                        <Template>
                          <li>           
                            <a runat="server" href='<%# NavigationUtilities.ResolveUrl(Container.DataItem) %>' target='<%# NavigationUtilities.GetLinkTarget(Container.DataItem) %>'><%# Eval("Title") %></a>          
                                <ul runat="server" id="childNodesContainer"></ul>
                            </li>                                        
                        </Template>
                      <SelectedTemplate>
                            <li>           
                                <a runat="server" href='<%# NavigationUtilities.ResolveUrl(Container.DataItem) %>' class="sfSel" target='<%# NavigationUtilities.GetLinkTarget(Container.DataItem) %>'><%# Eval("Title") %></a>          
                                  <ul runat="server" id="childNodesContainer"></ul>
                            </li>                                        
                        </SelectedTemplate>
                    </navigation:NavigationTemplate>
                </Templates>
        </navigation:NavigationContainer>
    </ul>
</div>

<%-- link to Kendo documentation demos.kendoui.com/.../index.html --%>

<script type="text/javascript">
    (function ($)
        var kendoTreeView = $('.sfNavTreeview').not('div.k-treeview .sfNavTreeview').kendoTreeView(
            animation: false,
            expand: function (e)
                if (window.DataIntelligenceSubmitScript)
                    DataIntelligenceSubmitScript._client.sentenceClient.writeSentence(
                        predicate: "Toggle navigation",
                        object: this.dataItem(e.node).text,
                        objectMetadata: [
                                                   
                                                        'K': 'PageTitle',
                                                        'V': document.title
                                                    ,
                                                   
                                                        'K': 'PageUrl',
                                                        'V': location.href
                                                   
                        ]
                    );
               
           
        ).data('kendoTreeView');
         if (kendoTreeView)
            kendoTreeView.expand(kendoTreeView.element.find(".sfSel"));
         
    )(jQuery);
</script>

 

 

This thread is closed