Menus and Selected Tab

[horridohobbyist]

I was just wondering...

When you select a menu tab from the menu, it doesn't get highlighted.
Highlighting the current menu tab is expected behavior for every menu
system I've ever seen on the web.

What am I missing here? Is there an option I need to enable?

Thanks,
Richard

[ron_m]

If you are using superfish menus in views/layout.html hee is what I did.

I changed
      <script type="text/javascript">
        jQuery(document).ready(function(){
        jQuery('ul.sf-menu').superfish();});
      </script>

to be
      <script type="text/javascript">
        jQuery(document).ready(function(){
        jQuery('ul.sf-menu').superfish({pathClass: 'web2py-menu-active'});});
      </script>

Really only a parameter addition in third line, extra lines are there to add context.

Then look for the superfish.css file for the selector
.sf-menu a:focus, .sf-menu a:hover, .sf-menu a:active {
if you want a different color than the default.

Ron

[horridohobbyist]

I tried that (though I didn't bother to change the default color).
Doesn't seem to work - the active menu still isn't highlighted.

Regards,
Richard

[Paolo Caruccio]

If you're using respone.menu to build your menu and in line with http://www.web2py.com/book/default/search?search=response.menu

you could replace the second item (the boolean value)in the tuple with the check (request.function=='index') where index is your active page.

In this way web2py automatically add to li tag (your menu tab) the class="web2py-menu-active". So in .css file you can customize it.

For example (I'm using default w2p application "welcome"):

### in menu.py (welcome app models folder) ###

response.menu = [

    (T('Home'), False, URL('default','index'), [])

    ]

becomes

response.menu = [

    (T('Home'), (request.function=='index'), URL('default','index'), [])

    ]

### in layout.html (welcome app views folder ###

change this

{{=MENU(response.menu,_class='sf-menu')}}

to 

{{=MENU(response.menu,_class='sf-menu',li_active="tab_highlighted")}}

li_active allows to change default class "web2py-menu-active" to your preference. In the above example "tab_highlighted".

### in base.css (welcome app static/css subfolder) 

append the css rule

.web2py-menu-active a, .tab_highlighted a{color:red}

Ciao.

Paolo

[ron_m]

Oops sorry forgot a detail, I did this a while back

I have a simple mapping of top level menu item to controller name so this works for me because of how it is organized. This allows me to remove functions from the application depending on where it is installed. Some clients don't use every possible top level menu item.

So to figure out the active path in model/menu.py all i need is

    active_path = request.controller

Then the menu items are constructed with a True False in the second item of the tuple using logic like this on each item.

            response.menu+=[
                (MAP, True if active_path == 'map' else False, URL(c='map', f='index'), [])       
            ]

MAP = T('Map') to allow translation to fill out a missing part of the above code fragment.


I realize this has some limitations such as forcing a top level menu item and a controller name to be connected but I was willing to accept that..

[horridohobbyist]

Sorry, I tried it, but it didn't work.

Richard

On Oct 17, 3:00 pm, Paolo Caruccio <paolo.carucci...@gmail.com> wrote:
> If you're using respone.menu to build your menu and in line withhttp://www.web2py.com/book/default/search?search=response.menu

[horridohobbyist]

This is all very messy. I think I'll just leave well enough alone.
Pity, though.

I'm quite surprised at how poorly thought-out the Superfish menu
system is.

Richard

[Paolo Caruccio]

Richard,

could you post not working code sample?

Ciao.

Paolo

[horridohobbyist]

Sorry, it does work. I forgot to clear the damn browser cache! (This
bites me in the ass every frickin' time!)

Richard

On Oct 18, 11:06 am, Paolo Caruccio <paolo.carucci...@gmail.com>
wrote:

[horridohobbyist]

In the latest version of web2py, this solution no longer works. There's no "web2py-menu-active" class. Is it now standard policy for web2py apps not to have menu selections highlighted?

Thanks.

[LoveWeb2py]

I would be interested in having this work as well. Was there ever a fix for this?

[Leonel Câmara]

A fix for what? It works perfectly fine in my apps.