Joomla! Issue Tracker - CMS

Download
Launch
Feeling Lucky

[#3121] - Menu's may not have the class='active'

?
avatar dougransom
dougransom
15 Feb 2014

Use a module to display both a top-level menu, and a submenu on certain pages.

The submenu doesn't get the 'class = active' set on the right item. Instead it is set for the parent item (which is also in the child menu). In this case both "investment solutions" on the main menu and "Goals Based Investing" on the child menu refer to the same article.

In this example the user has selected "Portfolio Construction" but in the menu Goals Based Investing is highlighted instead.

investment_solutions-5
portfolio_construction-4

Based on using a templated that is a tweaked protostar template.

here are the two menus html:

                        <nav class="navigation" role="navigation">
                <ul class="nav menu    nav-pills">
<li class="item-101"><a href="/" >Home</a></li><li class="item-112 current active deeper parent"><a href="/investmentsolutions" >Investment Solutions</a><ul class="nav-child unstyled small"><li class="item-132 active"><a href="/investmentsolutions" >Goals Based Investing</a></li><li class="item-128"><a href="/investmentsolutions/portfolio-construction" >Portfolio Construction</a></li><li class="item-129"><a href="/investmentsolutions/investment-cowards" >Investment Cowards</a></li><li class="item-130"><a href="/investmentsolutions/bold-investors" >Bold Investors</a></li><li class="item-131"><a href="/investmentsolutions/business-owners" >Business Owners</a></li></ul></li><li class="item-105"><a href="/productsandservices" >Products and Services</a></li><li class="item-102"><a href="/contact" >Contact</a></li><li class="item-106"><a href="/client-login" >Client Login</a></li><li class="item-108"><a href="/bio" >Bio</a></li><li class="item-120"><a href="/ias" >Industrial Alliance Securities Inc.</a></li></ul>

            </nav>

and 


<div class="moduletable_menu">
                    <h3>Investment Solutions</h3>
                    <ul class="nav menu nav-pills">
<li class="item-132 active"><a href="/investmentsolutions" >Goals Based Investing</a></li><li class="item-128"><a href="/investmentsolutions/portfolio-construction" >Portfolio Construction</a></li><li class="item-129"><a href="/investmentsolutions/investment-cowards" >Investment Cowards</a></li><li class="item-130"><a href="/investmentsolutions/bold-investors" >Bold Investors</a></li><li class="item-131"><a href="/investmentsolutions/business-owners" >Business Owners</a></li></ul>
        </div>

Here is the info on my joomla instance:

System Information
Setting Value

PHP Built On Linux box503.bluehost.com 3.4.79-20140208.1.bh6.x86_64 #1 SMP Sat Feb 8 12:29:59 EST 2014 x86_64
Database Version 5.5.36-log
Database Collation utf8_general_ci
PHP Version 5.4.24
Web Server Apache
WebServer to PHP Interface cgi-fcgi
Joomla! Version Joomla! 3.1.5 Stable [ Ember ] 01-August-2013 14:00 GMT
Joomla! Platform Version Joomla Platform 12.2.0 Stable [ Neil Armstrong ] 21-September-2012 00:00 GMT
User Agent Mozilla/5.0 (Macintosh; Intel Mac OS X 10_8_5) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/32.0.1700.107 Safari/537.36

Votes

# of Users Experiencing Issue
1/1
Average Importance Score
5.00
avatar dougransom dougransom - open - 15 Feb 2014
avatar Sepppl
Sepppl - comment - 20 Apr 2014

Hello,

I have similar problems, but in my case it is not recognized as a bug.
#3480

Have a look at the screenshots.
screen shot 2014-04-20 at 13 29 04screen shot 2014-04-20 at 13 29 24

If anyone can have a look at it, it is highly appreciated.

Thanks alot,
Seppppl
You may blame the J!Tracker Application for transmitting this comment.

avatar Sepppl
Sepppl - comment - 20 Apr 2014

Sorry,

here is the system-information:
Joomla 3.2.3
Php 5.3

Module-Settings:
Select Menu: Main Menu
Base-Item: Study
Start-level:2
End-Level: All
Show Sub-Menu Items: Yes
You may blame the J!Tracker Application for transmitting this comment.

avatar Bakual
Bakual - comment - 20 Apr 2014

Can you try with the "base item" as "current"?

avatar Sepppl
Sepppl - comment - 20 Apr 2014

@Bakual,
thanks for joining in!

I set "base-item" to "current".
I deleted the cache, rebuilt the navigation.
The result is the same as before.

I'm open for any suggestion ;-)


You may blame the J!Tracker Application for transmitting this comment.

avatar Sepppl
Sepppl - comment - 20 Apr 2014

@dougransom
please can you set a "JoomlaCode Tracker Item".
I don't know what it means, I guess your request gets done faster. (And mine too ;-) )


You may blame the J!Tracker Application for transmitting this comment.

avatar Bakual
Bakual - comment - 21 Apr 2014

Can you send me an email to bakual@bakual.ch? I can't reproduce this and would like to figure out where the problem is.

avatar Bakual
Bakual - comment - 28 Apr 2014

After investigating we found it's indeed not a bug and working as intended.
The class active is used when the menu item or its child is currently selected, thus the whole tree to the item gets this class.
The class current is the one which is applied to the currently active menu item.

If that doesn't behave like expected, then it's likely a menu module which isn't set up correctly.
Closing as it is not a bug.

avatar Bakual Bakual - change - 28 Apr 2014
Description <p>Use a module to display both a top-level menu, and a submenu on certain pages.</p> <p>The submenu doesn't get the 'class = active' set on the right item. Instead it is set for the parent item (which is also in the child menu). In this case both "investment solutions" on the main menu and "Goals Based Investing" on the child menu refer to the same article. </p> <p>In this example the user has selected "Portfolio Construction" but in the menu Goals Based Investing is highlighted instead.</p> <p><a href="https://f.cloud.github.com/assets/3534162/2178874/a37f6aaa-967e-11e3-8c19-f4b0683515f8.png" target="_blank"><img src="https://f.cloud.github.com/assets/3534162/2178874/a37f6aaa-967e-11e3-8c19-f4b0683515f8.png" alt="investment_solutions-5" style="max-width:100%;"></a><br><a href="https://f.cloud.github.com/assets/3534162/2178875/a399155e-967e-11e3-857b-65f7c943c67e.png" target="_blank"><img src="https://f.cloud.github.com/assets/3534162/2178875/a399155e-967e-11e3-857b-65f7c943c67e.png" alt="portfolio_construction-4" style="max-width:100%;"></a></p> <p>Based on using a templated that is a tweaked protostar template.</p> <p>here are the two menus html:</p> <pre><code> &lt;nav class="navigation" role="navigation"&gt; &lt;ul class="nav menu nav-pills"&gt; &lt;li class="item-101"&gt;&lt;a href="/" &gt;Home&lt;/a&gt;&lt;/li&gt;&lt;li class="item-112 current active deeper parent"&gt;&lt;a href="/investmentsolutions" &gt;Investment Solutions&lt;/a&gt;&lt;ul class="nav-child unstyled small"&gt;&lt;li class="item-132 active"&gt;&lt;a href="/investmentsolutions" &gt;Goals Based Investing&lt;/a&gt;&lt;/li&gt;&lt;li class="item-128"&gt;&lt;a href="/investmentsolutions/portfolio-construction" &gt;Portfolio Construction&lt;/a&gt;&lt;/li&gt;&lt;li class="item-129"&gt;&lt;a href="/investmentsolutions/investment-cowards" &gt;Investment Cowards&lt;/a&gt;&lt;/li&gt;&lt;li class="item-130"&gt;&lt;a href="/investmentsolutions/bold-investors" &gt;Bold Investors&lt;/a&gt;&lt;/li&gt;&lt;li class="item-131"&gt;&lt;a href="/investmentsolutions/business-owners" &gt;Business Owners&lt;/a&gt;&lt;/li&gt;&lt;/ul&gt;&lt;/li&gt;&lt;li class="item-105"&gt;&lt;a href="/productsandservices" &gt;Products and Services&lt;/a&gt;&lt;/li&gt;&lt;li class="item-102"&gt;&lt;a href="/contact" &gt;Contact&lt;/a&gt;&lt;/li&gt;&lt;li class="item-106"&gt;&lt;a href="/client-login" &gt;Client Login&lt;/a&gt;&lt;/li&gt;&lt;li class="item-108"&gt;&lt;a href="/bio" &gt;Bio&lt;/a&gt;&lt;/li&gt;&lt;li class="item-120"&gt;&lt;a href="/ias" &gt;Industrial Alliance Securities Inc.&lt;/a&gt;&lt;/li&gt;&lt;/ul&gt; &lt;/nav&gt; </code></pre> <p>and </p> <pre><code> &lt;div class="moduletable_menu"&gt; &lt;h3&gt;Investment Solutions&lt;/h3&gt; &lt;ul class="nav menu nav-pills"&gt; &lt;li class="item-132 active"&gt;&lt;a href="/investmentsolutions" &gt;Goals Based Investing&lt;/a&gt;&lt;/li&gt;&lt;li class="item-128"&gt;&lt;a href="/investmentsolutions/portfolio-construction" &gt;Portfolio Construction&lt;/a&gt;&lt;/li&gt;&lt;li class="item-129"&gt;&lt;a href="/investmentsolutions/investment-cowards" &gt;Investment Cowards&lt;/a&gt;&lt;/li&gt;&lt;li class="item-130"&gt;&lt;a href="/investmentsolutions/bold-investors" &gt;Bold Investors&lt;/a&gt;&lt;/li&gt;&lt;li class="item-131"&gt;&lt;a href="/investmentsolutions/business-owners" &gt;Business Owners&lt;/a&gt;&lt;/li&gt;&lt;/ul&gt; &lt;/div&gt; </code></pre> <p>Here is the info on my joomla instance:</p> <p>System Information<br> Setting Value</p> <p>PHP Built On Linux box503.bluehost.com 3.4.79-20140208.1.bh6.x86_64 <a href="https://github.com/joomla/joomla-cms/pull/1" class="issue-link" title="Test">#1</a> SMP Sat Feb 8 12:29:59 EST 2014 x86_64<br> Database Version 5.5.36-log<br> Database Collation utf8_general_ci<br> PHP Version 5.4.24<br> Web Server Apache<br> WebServer to PHP Interface cgi-fcgi<br> Joomla! Version Joomla! 3.1.5 Stable [ Ember ] 01-August-2013 14:00 GMT<br> Joomla! Platform Version Joomla Platform 12.2.0 Stable [ Neil Armstrong ] 21-September-2012 00:00 GMT<br> User Agent Mozilla/5.0 (Macintosh; Intel Mac OS X 10_8_5) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/32.0.1700.107 Safari/537.36</p> ⇒ <p>Use a module to display both a top-level menu, and a submenu on certain pages.</p> <p>The submenu doesn't get the 'class = active' set on the right item. Instead it is set for the parent item (which is also in the child menu). In this case both "investment solutions" on the main menu and "Goals Based Investing" on the child menu refer to the same article. </p> <p>In this example the user has selected "Portfolio Construction" but in the menu Goals Based Investing is highlighted instead.</p> <p><a href="https://camo.githubusercontent.com/2ee17e8b5a7ff1b52ba6304a942fb8caf9529ada/68747470733a2f2f662e636c6f75642e6769746875622e636f6d2f6173736574732f333533343136322f323137383837342f61333766366161612d393637652d313165332d386331392d6634623036383335313566382e706e67" target="_blank"><img src="https://camo.githubusercontent.com/2ee17e8b5a7ff1b52ba6304a942fb8caf9529ada/68747470733a2f2f662e636c6f75642e6769746875622e636f6d2f6173736574732f333533343136322f323137383837342f61333766366161612d393637652d313165332d386331392d6634623036383335313566382e706e67" alt="investment_solutions-5" data-canonical-src="https://f.cloud.github.com/assets/3534162/2178874/a37f6aaa-967e-11e3-8c19-f4b0683515f8.png" style="max-width:100%;"></a><br><a href="https://camo.githubusercontent.com/ba43d5e76da3be29493ef8f510bf5486362e9c32/68747470733a2f2f662e636c6f75642e6769746875622e636f6d2f6173736574732f333533343136322f323137383837352f61333939313535652d393637652d313165332d383537622d3635663763393433633637652e706e67" target="_blank"><img src="https://camo.githubusercontent.com/ba43d5e76da3be29493ef8f510bf5486362e9c32/68747470733a2f2f662e636c6f75642e6769746875622e636f6d2f6173736574732f333533343136322f323137383837352f61333939313535652d393637652d313165332d383537622d3635663763393433633637652e706e67" alt="portfolio_construction-4" data-canonical-src="https://f.cloud.github.com/assets/3534162/2178875/a399155e-967e-11e3-857b-65f7c943c67e.png" style="max-width:100%;"></a></p> <p>Based on using a templated that is a tweaked protostar template.</p> <p>here are the two menus html:</p> <pre><code> &lt;nav class="navigation" role="navigation"&gt; &lt;ul class="nav menu nav-pills"&gt; &lt;li class="item-101"&gt;&lt;a href="/" &gt;Home&lt;/a&gt;&lt;/li&gt;&lt;li class="item-112 current active deeper parent"&gt;&lt;a href="/investmentsolutions" &gt;Investment Solutions&lt;/a&gt;&lt;ul class="nav-child unstyled small"&gt;&lt;li class="item-132 active"&gt;&lt;a href="/investmentsolutions" &gt;Goals Based Investing&lt;/a&gt;&lt;/li&gt;&lt;li class="item-128"&gt;&lt;a href="/investmentsolutions/portfolio-construction" &gt;Portfolio Construction&lt;/a&gt;&lt;/li&gt;&lt;li class="item-129"&gt;&lt;a href="/investmentsolutions/investment-cowards" &gt;Investment Cowards&lt;/a&gt;&lt;/li&gt;&lt;li class="item-130"&gt;&lt;a href="/investmentsolutions/bold-investors" &gt;Bold Investors&lt;/a&gt;&lt;/li&gt;&lt;li class="item-131"&gt;&lt;a href="/investmentsolutions/business-owners" &gt;Business Owners&lt;/a&gt;&lt;/li&gt;&lt;/ul&gt;&lt;/li&gt;&lt;li class="item-105"&gt;&lt;a href="/productsandservices" &gt;Products and Services&lt;/a&gt;&lt;/li&gt;&lt;li class="item-102"&gt;&lt;a href="/contact" &gt;Contact&lt;/a&gt;&lt;/li&gt;&lt;li class="item-106"&gt;&lt;a href="/client-login" &gt;Client Login&lt;/a&gt;&lt;/li&gt;&lt;li class="item-108"&gt;&lt;a href="/bio" &gt;Bio&lt;/a&gt;&lt;/li&gt;&lt;li class="item-120"&gt;&lt;a href="/ias" &gt;Industrial Alliance Securities Inc.&lt;/a&gt;&lt;/li&gt;&lt;/ul&gt; &lt;/nav&gt; </code></pre> <p>and </p> <pre><code> &lt;div class="moduletable_menu"&gt; &lt;h3&gt;Investment Solutions&lt;/h3&gt; &lt;ul class="nav menu nav-pills"&gt; &lt;li class="item-132 active"&gt;&lt;a href="/investmentsolutions" &gt;Goals Based Investing&lt;/a&gt;&lt;/li&gt;&lt;li class="item-128"&gt;&lt;a href="/investmentsolutions/portfolio-construction" &gt;Portfolio Construction&lt;/a&gt;&lt;/li&gt;&lt;li class="item-129"&gt;&lt;a href="/investmentsolutions/investment-cowards" &gt;Investment Cowards&lt;/a&gt;&lt;/li&gt;&lt;li class="item-130"&gt;&lt;a href="/investmentsolutions/bold-investors" &gt;Bold Investors&lt;/a&gt;&lt;/li&gt;&lt;li class="item-131"&gt;&lt;a href="/investmentsolutions/business-owners" &gt;Business Owners&lt;/a&gt;&lt;/li&gt;&lt;/ul&gt; &lt;/div&gt; </code></pre> <p>Here is the info on my joomla instance:</p> <p>System Information<br> Setting Value</p> <p>PHP Built On Linux box503.bluehost.com 3.4.79-20140208.1.bh6.x86_64 <a href="https://github.com/joomla/joomla-cms/pull/1" class="issue-link" title="Test">#1</a> SMP Sat Feb 8 12:29:59 EST 2014 x86_64<br> Database Version 5.5.36-log<br> Database Collation utf8_general_ci<br> PHP Version 5.4.24<br> Web Server Apache<br> WebServer to PHP Interface cgi-fcgi<br> Joomla! Version Joomla! 3.1.5 Stable [ Ember ] 01-August-2013 14:00 GMT<br> Joomla! Platform Version Joomla Platform 12.2.0 Stable [ Neil Armstrong ] 21-September-2012 00:00 GMT<br> User Agent Mozilla/5.0 (Macintosh; Intel Mac OS X 10_8_5) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/32.0.1700.107 Safari/537.36</p>
Status New ⇒ Closed
Closed_Date 0000-00-00 00:00:00 ⇒ 2014-04-28 19:18:34
avatar Bakual Bakual - close - 28 Apr 2014
avatar zero-24 zero-24 - close - 28 Apr 2014
avatar zero-24 zero-24 - change - 7 Jul 2015
Labels Added: ?
Removed: ? ?

Add a Comment

Login with GitHub to post a comment