For the application I've been working on I wanted to add support for a third level of <li> tabs. I'm submitting my changes to the tabs.html (I renamed it tabs.vm for my project) and tabs.js files. I refactored tabs.js significantly, hopefully I've commented it enough to make sense. The third level can be named/classed anything containing the text "submenu".

I've only tested it on IE5.5 currently, hope to expand that later today or tomorrow.

Note: My third layer of tabs is actually not visible, it exists to keep the second layer "selected" while the app goes through it's workflow (of sorts), so my CSS file only added

#menuList ul.subsubmenu {
    display: none;
    width: 90%;
}

If you want it to be visible you'll need to work on the CSS file more extensively. Tomorrow is my last day on this project, so I don't expect I'll be doing a lot of StrutsMenu work after that (we'll see).

Lance
## displayMenu is defined in WEB-INF/classes/globalMacros.vm
#macro( menuItem $menu $level )
        ## set title
        #set ($title = $displayer.getMessage($menu.title))
        #if (!$menu.url) $menu.setUrl($menu.components.get(0).url) #end
        <li><a href="$!{menu.url}" title="$title" target="$!{menu.target}">${title}</a>
        #if ($level == 0)
                #if ($menu.components.size() > 0) 
                        #set ($numItems = $menu.components.size())
        <ul class="submenu">
                #else 
        </li>
                #end
        #elseif ($level == 1)
                #if ($menu.components.size() > 0) 
                    #set ($numItems = $menu.components.size())
                <ul class="subsubmenu">
                #elseif ($velocityCount == $numItems) 
        </ul>
        </li>
                #end
        #elseif ($level == 2)
        </li>
                #if ($velocityCount == $numItems)
                </ul>
        </ul>
        </li>
                #end
        #end
#end

#displayMenu($menu 0)

Attachment: tabs.js
Description: JavaScript source

Reply via email to