Jahia in English > menu which displays...

0 (0 Good)
0 (0 Bad)

menu which displays only child nodes of selected menu item

by  muristan »  2014/08/16 15:31

I put just one vertical menu on the left for all my website. Actually all the second level menu items are displayed for all the first level menu items.

I just want displayed the second level menu item of the selected first level menu item.

I now I have copy jahia6.6.2/tomcat/webapps/ROOT/modules/default/jnt_navMenu/html/navMenu.groovy to jahia6.6.2/tomcat/webapps/ROOT/modules/myTemplate/jnt_navMenu/html/navMenu.groovy and to modify it.

What code lines must be changed in navMenu.groovy to display only the child nodes of selected menu item??

  (muristan)

Number of messages  24
Registration date
0 (0 Good)
0 (0 Bad)

Re: menu which displays only child nodes of selected menu item

by  vagarwal »  2015/04/23 07:05

 

You will need to override the default view code for navigation menu to hide/show the menu childs, and use this custom view from your template set, when adding the nav menu module to your template design.

 

STEP A:

In your template set, add the jnt_navMenu/html folder, and then create two files, "navMenu.someMenuName.groovy.html" and "navMenu.someMenuName.properties"

 

STEP B:

Properties to contain : 

cache.mainResource=true
cache.mainResource.flushParent=true

 

 

STEP C:

In the groovy file, copy the original code from module source for jnt_navMenu from defaultXXX.jar, and add the code in bold, basically, try to see if a menu or one of its child ( in case of multilevel menu ) was selected, if yes then only select the child, else not.

Groovy is like Java, feel free to add your logic or a better way to hide/show based on your custom requirement.

Original code for me in : \Jahia-DigitalFactory7-SDK\tomcat\webapps\ROOT\WEB-INF\var\modules\default-7.0.0.3\jnt_navMenu\html\navMenu.groovy

 

foundAChildSelected = false
def hasAChildSelected(node){

     if (node) {
          children = JCRContentUtils.getChildrenOfType(node, "jmix:navMenuItem")
          children.eachWithIndex() { menuItem, index ->
            itemPath = menuItem.path;
            if(renderContext.mainResource.node.path == itemPath){
               foundAChildSelected = true;
            }
            children = JCRContentUtils.getChildrenOfType(menuItem, "jmix:navMenuItem")
            def nbOfChilds = children.size();
            if(nbOfChilds > 0){
               hasAChildSelected(menuItem);
            } 
          
          }//child ends
     }//if ends
}//method ends

 

.....

                       print render
                        // end template:module
                    }
                    if (hasChildren) {
                      
                    hasAChildSelected(menuItem);

                    if(selected || foundAChildSelected){
                            foundAChildSelected = false;
                            printMenu(menuItem, navMenuLevel + 1, true)
                    }


//                    print "<li>"
//                    printMenu(menuItem, navMenuLevel + 1, true)
//                    print "</li>"
                    }
                    if (render != "") {
                        print "</li>"

 

 

 

STEP D:

Finally use this 'someMenu' in the view, when you drop a navigation menu on your template in the 'Layout' tab of dropped 'navigation menu' component, under View section.

 

  • Re: menu which displays only child nodes of selected menu item
    2015/04/23 07:10

    vagarwal <blockquote> <div>&nbsp;</div> <div> <p style="line-height: 20.7999992370605px;">You will need to override the default view code for navigation menu to hide/show the menu childs, and use this custom view from your template set, when adding the nav menu module to your template design.</p> <p style="line-height: 20.7999992370605px;">&nbsp;</p> <p style="line-height: 20.7999992370605px;">STEP A:</p> <p style="line-height: 20.7999992370605px;"><span style="font-family: Georgia, Times, 'Times New Roman', serif; font-style: italic; line-height: 20.7999992370605px;">In your template set, add the jnt_navMenu/html folder, and then create two files, &quot;navMenu.someMenuName.groovy.html&quot; and &quot;</span><span style="font-family: Georgia, Times, 'Times New Roman', serif; font-style: italic; line-height: 20.7999992370605px;">navMenu.</span><span style="font-family: Georgia, Times, 'Times New Roman', serif; font-style: italic; line-height: 20.7999992370605px;">someMenuName</span><span style="font-family: Georgia, Times, 'Times New Roman', serif; font-style: italic; line-height: 20.7999992370605px;">.properties&quot;</span></p> <p style="line-height: 20.7999992370605px;">&nbsp;</p> <p style="line-height: 20.7999992370605px;">STEP B:</p> <p style="line-height: 20.7999992370605px;">Properties to contain :&nbsp;</p> <p style="line-height: 20.7999992370605px;">cache.mainResource=true<br /> cache.mainResource.flushParent=true</p> <p style="line-height: 20.7999992370605px;">&nbsp;</p> <p style="line-height: 20.7999992370605px;">&nbsp;</p> <p style="line-height: 20.7999992370605px;">STEP C:</p> <p style="line-height: 20.7999992370605px;">In the groovy file, copy the original code from module source for jnt_navMenu from defaultXXX.jar, and add the&nbsp;code in <strong><em>bold</em></strong>, basically, try to see if a menu or one of its child ( in case of multilevel menu )&nbsp;was selected, if yes then only select the child, else not.</p> <p style="line-height: 20.7999992370605px;">Groovy is like Java, feel free to add your logic or a better way to hide/show based on your custom requirement.</p> <p style="line-height: 20.7999992370605px;">Original code for me in :&nbsp;\Jahia-DigitalFactory7-SDK\tomcat\webapps\ROOT\WEB-INF\var\modules\default-7.0.0.3\jnt_navMenu\html\navMenu.groovy</p> <p style="line-height: 20.7999992370605px;">&nbsp;</p> <p style="line-height: 20.7999992370605px;"><strong>foundAChildSelected = false<br /> def hasAChildSelected(node){</strong></p> <p style="line-height: 20.7999992370605px;"><strong>&nbsp; &nbsp; &nbsp;if (node) {<br /> &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; children = JCRContentUtils.getChildrenOfType(node, &quot;jmix:navMenuItem&quot;)<br /> &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; children.eachWithIndex() { menuItem, index -&gt;<br /> &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; itemPath = menuItem.path;<br /> &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; if(renderContext.mainResource.node.path == itemPath){<br /> &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;foundAChildSelected = true;<br /> &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; }<br /> &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; children = JCRContentUtils.getChildrenOfType(menuItem, &quot;jmix:navMenuItem&quot;)<br /> &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; def nbOfChilds = children.size();<br /> &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; if(nbOfChilds &gt; 0){<br /> &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;hasAChildSelected(menuItem);<br /> &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; }&nbsp;<br /> &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;&nbsp;<br /> &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; }//child ends<br /> &nbsp; &nbsp; &nbsp;}//if ends<br /> }//method ends</strong></p> <p style="line-height: 20.7999992370605px;">&nbsp;</p> <p style="line-height: 20.7999992370605px;">.....</p> <p style="line-height: 20.7999992370605px;">&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;print render<br /> &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; // end template:module<br /> &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; }<br /> &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; if (hasChildren) {<br /> &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;&nbsp;<br /> &nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp;<strong>&nbsp;hasAChildSelected(menuItem);</strong></p> <p style="line-height: 20.7999992370605px;">&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; if(selected&nbsp;<strong>|| foundAChildSelected</strong>){<br /> &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp;<strong>&nbsp;foundAChildSelected = false;</strong><br /> &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;printMenu(menuItem, navMenuLevel + 1, true)<br /> &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; }</p> <p style="line-height: 20.7999992370605px;"><br /> // &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;print &quot;&lt;li&gt;&quot;<br /> // &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;printMenu(menuItem, navMenuLevel + 1, true)<br /> // &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;print &quot;&lt;/li&gt;&quot;<br /> &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; }<br /> &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; if (render != &quot;&quot;) {<br /> &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; print &quot;&lt;/li&gt;&quot;</p> <p style="line-height: 20.7999992370605px;">&nbsp;</p> <p style="line-height: 20.7999992370605px;">&nbsp;</p> <p style="line-height: 20.7999992370605px;">&nbsp;</p> <p style="line-height: 20.7999992370605px;">STEP D:</p> <p style="line-height: 20.7999992370605px;">Finally use this &#39;someMenu&#39; in the view, when you drop a navigation menu on your template in the &#39;Layout&#39; tab of dropped &#39;navigation menu&#39; component, under View section.</p> </div> </blockquote> <p>&nbsp;</p>

  • Number of messages  1
    Registration date Apr 23, 2015
    Contact
    Share
    Feedback

    Get in touch

    Whether you are a current user or if you are just evaluating Jahia, we are here to help.

    Contact us

    Share this page