Copied to clipboard

Flag this post as spam?

This post will be reported to the moderators as potential spam to be looked at


  • Matt 221 posts 547 karma points
    Jul 16, 2019 @ 07:10
    Matt
    0

    Render Navigation in umbraco 8

    Hi all,

    Sorry but I'm pretty new to coding and could do with a little pointer.

    I'm trying to create a navigation for my website with children, I have the following code but my website doesn't seem to like it and just throws out errors;

    Compiler Error Message: CS1061: 'IPublishedContent' does not contain a definition for 'Any' and no accessible extension method 'Any' accepting a first argument of type 'IPublishedContent' could be found (are you missing a using directive or an assembly reference?)

        @inherits Umbraco.Web.Mvc.UmbracoViewPage
    
    
    @{
        IPublishedContent homePage = Model.Root();
        IEnumerable<IPublishedContent> navigationPages = homePage.Children(x => x.IsVisible());
    }
    
    
    
    
    <div data-collapse="medium" data-animation="default" data-duration="400" class="navbar w-nav">
        <div class="nav-container w-container">
            <nav role="navigation" class="nav-menu w-nav-menu">
                @* //The top level requires different rendering to children so let us split it up. *@
                @foreach (var topLevelEntry in Model)
                {
                    //We need to check if this has children or not
                    if (topLevelEntry.Children != null && topLevelEntry.Children.Any())
                    {
                        <div data-hover="1" data-delay="0" class="drop-down-menu w-dropdown">
                            <div class="nav-link w-dropdown-toggle">
                                <a href="@topLevelEntry.Url" class="link-dropdown">
                                    <div>@topLevelEntry.Title</div>
                                </a>
                            </div>
                            <nav class="w-dropdown-list">
                                @RenderChildren(topLevelEntry.Children)
                            </nav>
                        </div>
                    }
                    else
                    {
                        <a href="@topLevelEntry.Url" class="nav-link w-nav-link">@topLevelEntry.Title</a>
                    }
                }
            </nav>
            <div class="menu-button w-nav-button">
                <div class="mobile-icon w-icon-nav-menu"></div>
            </div>
        </div>
    </div>
    
    @helper RenderPageLink(IPublishedContent item)
    {
        if (item.Any())
        {
            foreach (var item in item)
            {
                <a href="@item.Url" class="drop-down-link w-dropdown-link">@item.Title</a>
            }
        }
    }
    
  • Sibren 22 posts 134 karma points
    Jul 16, 2019 @ 13:24
    Sibren
    0

    Hi Matt,

    I think you're missing the System.Linq namespace in your usings? https://docs.microsoft.com/en-us/dotnet/api/system.linq.enumerable.any?view=netframework-4.7.2

    Btw: your error says IPublishedContent does not contain a definition for any (which is correct, because it's a single item).

    Is your model a List

    if (topLevelEntry.Children != null && topLevelEntry.Children.Any())

    This should work once the namespace is added.

  • Matt 221 posts 547 karma points
    Jul 16, 2019 @ 14:12
    Matt
    0

    Hmm I'm afraid you lost me with the last bit?

    I added the namespace although doesn't look like its made a difference or even recognise it....

    Thanks

  • Matt 221 posts 547 karma points
    Jul 18, 2019 @ 08:12
    Matt
    0

    Morning all,

    Anyone able to give me a few pointers to get this code working?

    Thanks

    Matt

  • Erik-Jan Westendorp 25 posts 257 karma points
    Jul 23, 2019 @ 15:32
    Erik-Jan Westendorp
    0

    Hi Matt,

    There are a couple of mistakes in your code and you should fix them.

    Let's discuss the RenderPageLink method first. As the error says and Sibren mentioned before, PublishedContent does not contain a definition for any (which is correct, because it's a single item). You can use the .Any method on collections. In this case at most you can add a null check. Your method should look like the code below.

    @helper RenderPageLink(IPublishedContent item)
    {
        //Check if item not is null
        if (item !=  null)
        {
            // Render url for each child page
            foreach (var child in item.Children())
            {
                <a href="@child.Url" class="drop-down-link w-dropdown-link">@child.Name</a>
            }
        }
    }
    

    Correct me if I'm wrong but I expect that you want to check if a navigation page has children and if so you want to show a link for each of them and if not you want to show the link of the navigation page itself? You can achieve this by doing something like this:

     @foreach (var page in navigationPages)
     {
         //We need to check if this has children or not
         if (page.Children.Any())
         {
             <div data-hover="1" data-delay="0" class="drop-down-menu w-dropdown">
                 <div class="nav-link w-dropdown-toggle">
                     <a href="@page.Url" class="link-dropdown">
                         <div>@page.Name</div>
                     </a>
                 </div>
                 <nav class="w-dropdown-list">
                     @foreach (var child in page.Children())
                     {
                         @RenderPageLink(child)
                     }
                 </nav>
              </div>
           }
           else
           {
               <a href="@page.Url" class="nav-link w-nav-link">@page.Name</a>
           }
      }
    

    The full code should look something like this.

    @inherits Umbraco.Web.Mvc.UmbracoViewPage
    @{    
            IPublishedContent homePage = Model.Root();
            IEnumerable<IPublishedContent> navigationPages = homePage.Children(x => x.IsVisible());
    }
    
    
    
    
    <div data-collapse="medium" data-animation="default" data-duration="400" class="navbar w-nav">
        <div class="nav-container w-container">
            <nav role="navigation" class="nav-menu w-nav-menu">
                @* //The top level requires different rendering to children so let us split it up. *@
                @foreach (var page in navigationPages)
                {
                    //We need to check if this has children or not
                    if (page.Children.Any())
                    {
                        <div data-hover="1" data-delay="0" class="drop-down-menu w-dropdown">
                            <div class="nav-link w-dropdown-toggle">
                                <a href="@page.Url" class="link-dropdown">
                                    <div>@page.Name</div>
                                </a>
                            </div>
                            <nav class="w-dropdown-list">
                                @foreach (var child in page.Children())
                                {
                                    @RenderPageLink(child)
    
                                }
    
                            </nav>
                        </div>
                    }
                    else
                    {
                        <a href="@page.Url" class="nav-link w-nav-link">@page.Name</a>
                    }
                }
            </nav>
            <div class="menu-button w-nav-button">
                <div class="mobile-icon w-icon-nav-menu"></div>
            </div>
        </div>
    </div>
    
    @helper RenderPageLink(IPublishedContent item)
    {
        //Check if item not is null
        if (item !=  null)
        {
            // Render url for each child page
            foreach (var child in item.Children())
            {
                <a href="@child.Url" class="drop-down-link w-dropdown-link">@child.Name</a>
            }
        }
    }
    
Please Sign in or register to post replies

Write your reply to:

Draft