Copied to clipboard

Flag this post as spam?

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


  • Stefan Arngrimsson 36 posts 59 karma points
    Mar 31, 2011 @ 12:41
    Stefan Arngrimsson
    0

    Help with Navigation

    Hi,

    I have 5 levels in my navigation. When I'm on my second level I want the third level to dispay underneath the second one, but all other third levels in the navigation should be hidden.This works fine when I click the second one, but when I want the third level page to be selected it dissapears.

    Here is the code I'm using, can anyone help with this?

    @inherits umbraco.MacroEngines.DynamicNodeContext

    @helper traverse(dynamic node){

       var items node.Children.Where("Visible");
                 foreach (var item in items{
                   var mylevel ""
                   var aClass "";  
                   
                                   if(@Model.Id == item.Id)
                                    
                                       switch((int)item.Level)
                                       {
                                         case 3:
                                         mylevel ="secondlevelliselected";
                                         aClass ="secondLevelSelected";
                                         break;
                                         case 4:
                                         mylevel ="thirdlevelliselected";
                                         aClass ="thirdLevelSelected";
                                         break;
                                         case 5:
                                         mylevel ="frothlevelliselected";
                                         aClass ="forthLevelSelected";
                                         break;
                                       }
                                     }  
                                      else
                                      
                                         switch((int)item.Level)
                                         {
                                           case 3:
                                           mylevel ="secondlevelli";
                                           aClass ="secondLevel";
                                           break;
                                          
                                          case 4:
                                           mylevel ="thirdlevelli";
                                           aClass ="thirdLevel";
                                           break;
                                          
                                           case 5:
                                           mylevel ="forthlevelli";
                                           aClass ="forthLevel";
                                           break;
                                         }
                                       }      
                                              
                  
                    <li class="@mylevel">
                      <href="@item.Url" class="@aClass">@item.Name</a>
                    </li>
                       if(item.Id == @Model.Id)
                                          {    
                     @traverse(item)
                                           }

                }
    }

    <div class="sitemap"
    <ul id="sub_navlist">
        @traverse(@Model.AncestorOrSelf(2))
    </ul>
    </div>

  • Sebastiaan Janssen 5045 posts 15476 karma points MVP admin hq
    Mar 31, 2011 @ 15:35
    Sebastiaan Janssen
    0

    I'm not sure what's going on, but it sounds like it's not really a Razor problem. 

    I suggest you build what you want in pure HTML first and when that works like you want it, compare the HTML version to the HTML that's being produced by this snippet. I'm pretty sure it's just a styling / javascript issue somewhere.

  • Stefan Arngrimsson 36 posts 59 karma points
    Mar 31, 2011 @ 15:39
    Stefan Arngrimsson
    0

    Hi,

    The HTML is correct. the problem is that I'm converting this xslt to razor. Not sure how to break the loop to get correct functionality.

     

    <?xml version="1.0" encoding="UTF-8"?>
    <!DOCTYPE xsl:Stylesheet [
      <!ENTITY nbsp "&#x00A0;">
    ]>
    <xsl:stylesheet
    version="1.0"
    xmlns:xsl="http://www.w3.org/1999/XSL/Transform"
    xmlns:msxml="urn:schemas-microsoft-com:xslt"
    xmlns:umbraco.library="urn:umbraco.library"
    exclude-result-prefixes="msxml umbraco.library">
      <xsl:output method="xml" omit-xml-declaration="yes"/>

      <xsl:param name="currentPage"/>
      <xsl:param name="startLevel" select="2"/>

      <xsl:template match="/">
        <xsl:if test="count($currentPage/ancestor-or-self::*[@isDoc] [@level = $startLevel]/*[@isDoc] ) &gt; 0">
          
            <xsl:for-each select="$currentPage/ancestor-or-self::*[@isDoc] [@level=$startLevel]/*[@isDoc][string(umbracoNaviHide) != '1' and string(mytest) != '0' ] ">
              <xsl:call-template name="drawnode">
                <xsl:with-param name="level" select="2"/>
              </xsl:call-template>
            </xsl:for-each>
         
        </xsl:if>
      </xsl:template>

      <xsl:template name="drawnode">
        <xsl:param name="level"/>
        <li>
          <xsl:choose>
            <xsl:when test="@id=$currentPage/@id">
      <xsl:if test="$level = 2">
              <xsl:attribute name="class">secondlevelliselected</xsl:attribute>
      </xsl:if>
      <xsl:if test="$level = 3">
              <xsl:attribute name="class">thirdlevelliselected</xsl:attribute>
      </xsl:if>
      <xsl:if test="$level = 4">
              <xsl:attribute name="class">frothlevelliselected</xsl:attribute>
      </xsl:if>
            </xsl:when>
            <xsl:otherwise>
      <xsl:if test="$level = 2">
              <xsl:attribute name="class">secondlevelli</xsl:attribute>
      </xsl:if>
      <xsl:if test="$level = 3">
              <xsl:attribute name="class">thirdlevelli</xsl:attribute>
      </xsl:if>
      <xsl:if test="$level = 4">
              <xsl:attribute name="class">forthlevelli</xsl:attribute>
      </xsl:if>
            </xsl:otherwise>
          </xsl:choose>
          <href="{umbraco.library:NiceUrl(@id)}">
            <xsl:choose>
              <xsl:when test="@id=$currentPage/@id">
        <xsl:if test="$level = 2">
                    <xsl:attribute name="class">secondLevelSelected</xsl:attribute>
          </xsl:if>
        <xsl:if test="$level = 3">
                    <xsl:attribute name="class">thirdLevelSelected</xsl:attribute>
          </xsl:if>
        <xsl:if test="$level = 4">
                    <xsl:attribute name="class">forthLevelSelected</xsl:attribute>
          </xsl:if>
              </xsl:when>
              <xsl:otherwise>
        <xsl:if test="$level = 2">
                    <xsl:attribute name="class">secondLevel</xsl:attribute>
        </xsl:if>
        <xsl:if test="$level = 3">
                    <xsl:attribute name="class">thirdLevel</xsl:attribute>
        </xsl:if>
        <xsl:if test="$level = 4">
                    <xsl:attribute name="class">forthLevel</xsl:attribute>
        </xsl:if>
              </xsl:otherwise>
            </xsl:choose>
              <xsl:value-of select="@nodeName"/>
          </a>
    </li>

       
          <xsl:if test="count(descendant-or-self::*[@isDoc] [@id=$currentPage/@id]) &gt; 0 ">
            
            <xsl:for-each select="*[@isDoc ][string(umbracoNaviHide) != '1' ] [@nodeTypeAlias = 'Frett'= 0 and string(mytest) != '0']">
                <xsl:call-template name="drawnode">
          <xsl:with-param name="level" select="$level +1"/>
        </xsl:call-template>
              </xsl:for-each>
           
          </xsl:if>
        
      </xsl:template>

    </xsl:stylesheet>

  • Sebastiaan Janssen 5045 posts 15476 karma points MVP admin hq
    Apr 01, 2011 @ 08:23
    Sebastiaan Janssen
    0

    If this is your XSLT then the HTML surely isn't correct, as I see all kinds of differences in the casing of the CSS class names, which I assume are used by javascript to render your menu. 

    So my recommendation stands, try to figure out which are the exact differences between the output of your XSLT and your Razor template.

    Right now, this code is pretty difficult to read and I am unsure of its intention without looking at it long and hard. If you can point me to a particual problem area in your Razor code, I can help you out (for example: "the nodes on level 3 aren't rendering, when I am in debug mode, I see that I get in the else statement, but ... " something like that). 

  • chris vdP 13 posts 35 karma points
    Sep 09, 2011 @ 01:29
    chris vdP
    2

    Sorry to bring back an old post, but I found the base code useful and fixed up the error where children wouldn't display.

    The problem is bascially in this line

    if(item.Id == @Model.Id)

    as it only checks in the parent node is the current node so it never is true with child nodes.

    I wasn't sure how to use the .Where stuff so I did this, which checks the children as well

    if(item.Id == @Model.Id)
    {    
    @traverse(item)
    }else{
    foreach(var child in item.Children){
            if(child.Id == @Model.Id){@traverse(item);break;}                                                         
            }
    }

    I also fixed up the html. You should be able to select anything you need with this, much neater though. putting selected on li and a is redundant as you can get it with 'li.selected a' 

    @inherits umbraco.MacroEngines.DynamicNodeContext

    @helper traverse(dynamic node){
    <ul>
     @{
       var items node.Children.Where("Visible");
       foreach (var item in items{
         var mylevel "";               
         
         if(@Model.Id == item.Id)
          {                   
               mylevel ="class=selected";
           }  
                             
                                    
        
          <li @mylevel>
            <href="@item.Url" >@item.Name</a>
          </li>
             if(item.Id == @Model.Id)
                                {    
           @traverse(item)
                                 }
            else{
                 foreach(var child in item.Children){
                    if(child.Id == @Model.Id){@traverse(item);break;}                                                         
                 }
               }

      }
    }
    </ul>
    }

    <div class="sitemap"

        @traverse(@Model.AncestorOrSelf(2))

    </div>


Please Sign in or register to post replies

Write your reply to:

Draft