Copied to clipboard

Flag this post as spam?

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


  • Scott Lightening 3 posts 53 karma points
    Jul 22, 2014 @ 17:12
    Scott Lightening
    0

    Creating a dynamic list that expands.

    I've been trying to create a navigation list that basicly wroks like this 

     

    <ul>

    <li></li> Expand the child when the user is ont the page. 

    <ul>

    <li></li>Then again on this level but keeps the anstor levels. 

    <ul>

    <li></li>

    </ul>

    </ul>

    <li></li> And repat on this level etc... 

    <li></li>

    </ul>

     

    I've got it working so far by using this 

     

     <ul class="navLevel0" id="subList">
    
            @{
                   var mainPage = Model.Content.AncestorOrSelf(2);
                   var menuItems = mainPage.Children;       
            }
    
            @foreach (var subItem in menuItems)
                {
    
                <li class="navLevel0"><a href="@subItem.Url">@subItem.GetPropertyValue("title")</a></li>
    
                    if (subItem.Descendants().Count() > 0 && subItem.Id == Model.Content.Id)
                    {
                        var itemList2 = subItem.Children;
    
                        foreach(var item in itemList2)
                        {
                            <ul>
                               <li class="navLevel0"><a href="@item.Url">@item.GetPropertyValue("title")</a></li>
    
                            </ul>
    
                        }
    
                    }
    
                    else if(Model.Content.Parent.Id == subItem.Id)
                    {
                        var itemList2 = subItem.Children;
    
                        foreach(var item in itemList2)
                        {
                            <ul>
                               <li class="navLevel0"><a href="@item.Url">@item.GetPropertyValue("title")</a></li>
                                @if (Model.Content.Descendants().Count() > 0)
                                {
                                    var itemList3 = Model.Content.Children;
    
                                    <ul>
                                        @foreach (var item2 in itemList3)
                                        {
                                            <li class="navLevel0"><a href="@item2.Url">@item2.GetPropertyValue("title")</a></li>
                                        }
    
                                    </ul>
                                }
                            </ul>
    
                        }
    
    
                    }
    
                    else if (Model.Content.Ancestor(3).Id == subItem.Id)
                    {
                        var itemList2 = subItem.Children;
    
    
                        foreach(var item in itemList2)
                        {
                            <ul>
                               <li class="navLevel0"><a href="@item.Url">@item.GetPropertyValue("title")</a></li>
                                @if (Model.Content.Descendants().Count() > 0)
                                {
                                    var itemList3 = Model.Content.Parent.Children;
    
                                    <ul>
                                        @foreach (var item2 in itemList3)
                                        {
                                            <li class="navLevel0"><a href="@item2.Url">@item2.GetPropertyValue("title")</a></li>
    
                                            if(Model.Content.Descendants().Count() > 0)
                                            {
                                                var itemList5 = Model.Content.Children;
                                                <ul>
                                                @{var itemlist5 = Model.Content.Children;}
                                                @foreach (var item5 in itemList5)
                                                {
                                                    <li class="navLevel0"><a href="@item5.Url">@item5.GetPropertyValue("title")</a></li>
                                                }
                                                </ul>
                                            }
    
                                        }
    
                                    </ul>
                                }
                            </ul>

    This works but wanted to know if there's a better way? Cleaner and would work no mater how meny child nodes. Thanks. 

  • This forum is in read-only mode while we transition to the new forum.

    You can continue this topic on the new forum by tapping the "Continue discussion" link below.

Please Sign in or register to post replies