Usage of submenu / menuitem in main menu

angelo.celoni
Posts: 1
Joined: 19 Apr 2016, 09:55

26 Oct 2016, 16:13

I'm using "olympos-customMenu-1.0.jar" with the following code:

Code: Select all

<h:form id="menuform">
	<po:tabmenu widgetVar="OlymposMenu">
		<p:ajax event="tabChange" oncomplete="console.log('tabChange')" />
		<po:menu id="menu-main" title="Menu Principale" icon="fa fa-cubes">
			<p:submenu id="submenu-main" label="Menu Principale">
				<p:menuitem id="home" value="Home" icon="fa fa-home" url="home.xhtml" /> 
				<p:menuitem id="pagina1" value="Pagina 1" icon="fa fa-list" url="home.xhtml" />
				<p:menuitem id="help" value="Aiuto" icon="fa fa-question" target="_blank" url="/resources/docs/manuale.pdf" />
				<p:menuitem id="logout" value="Logout" icon="fa fa-power-off"  url="/saml/logout/" /> 
			</p:submenu>
		</po:menu>
		<po:menu id="menu-tables" title="Menu Tabelle" icon="fa fa-table">
			<p:submenu id="submenu-tables" label="Tabelle">
				<p:menuitem id="menu-atc" value="ATC" icon="fa fa-table" url="/secure/atc.xhtml" />
				<p:menuitem id="menu-cittadinanza" value="Cittadinanza" icon="fa fa-table" url="/secure/cittadinanza.xhtml" />
				<p:menuitem id="menu-esenzione" value="Esenzione" icon="fa fa-table" url="/secure/esenzcod.xhtml" />
				<p:menuitem id="menu-tipo-assistito" value="Tipo Assistito" icon="fa fa-table" url="/secure/assistito.xhtml" />
			</p:submenu>
		</po:menu>
	</po:tabmenu>
   </h:form>
The first menu is working fine and whenever I click on a menuItem it is correctly highligthed; the second menu is working but the menuItem highlighted is always the first one clicked.

oschell
Posts: 11
Joined: 03 Apr 2015, 09:29

02 Mar 2017, 11:52

Any progress on that topic? I bought the olympos theme and would love to distribute my menus over multiple tab panels. This is really essential, otherwise the menus in other tabs have to be built "by hand" - not very efficient and they will look slightly different. I tried the customMenu component but I am getting the ClassCastExceptions too. Any means to avoid them?

deandeen
Posts: 7
Joined: 09 Jun 2016, 18:04

14 Apr 2017, 21:59

oschell wrote:
02 Mar 2017, 11:52
Any progress on that topic? I bought the olympos theme and would love to distribute my menus over multiple tab panels. This is really essential, otherwise the menus in other tabs have to be built "by hand" - not very efficient and they will look slightly different. I tried the customMenu component but I am getting the ClassCastExceptions too. Any means to avoid them?

Add following into faces-config.xml

Code: Select all

   <component>
        <component-type>org.primefaces.component.OlymposTabMenu</component-type>
        <component-class>org.primefaces.olympos.component.menu2.OlymposTabMenu</component-class>
    </component>
    
    <component>
        <component-type>org.primefaces.component.OlymposMenu</component-type>
        <component-class>org.primefaces.olympos.component.menu2.OlymposMenu</component-class>
    </component>
    
    <render-kit>
        <renderer>
            <component-family>org.primefaces.component</component-family>
            <renderer-type>org.primefaces.component.OlymposMenuRenderer</renderer-type>
            <renderer-class>org.primefaces.olympos.component.menu2.OlymposMenuRenderer</renderer-class>
        </renderer>
        
        <renderer>
            <component-family>org.primefaces.component</component-family>
            <renderer-type>org.primefaces.component.OlymposTabMenuRenderer</renderer-type>
            <renderer-class>org.primefaces.olympos.component.menu2.OlymposTabMenuRenderer</renderer-class>
        </renderer>
    </render-kit>

deandeen
Posts: 7
Joined: 09 Jun 2016, 18:04

14 Apr 2017, 22:07

@Aragorn

Check following code and you will see that second tab is not working ok. As already mentioned highlighting is on ok. Also if you have many nested nodes only first work. Once you click inside you cannot open another.

Code: Select all

<ui:composition 
    xmlns="http://www.w3.org/1999/xhtml"
    xmlns:f="http://java.sun.com/jsf/core"
    xmlns:h="http://java.sun.com/jsf/html"
    xmlns:ui="http://java.sun.com/jsf/facelets"
    xmlns:p="http://primefaces.org/ui"
    xmlns:po="http://primefaces.org/olympos">

    <h:form id="menuform">       
        <po:tabmenu widgetVar="OlymposMenu">
            <p:ajax event="tabChange" oncomplete="console.log('tabChange')" />
            <po:menu id="menu1"  title="Olympos Main Menu" icon="icon-speedometer33">
                <p:submenu id="om_menuoptcolor" label="MENU AND COLOR OPTIONS">
                    <p:menuitem id="om_def" url="#" value="Default Menu Option" icon="icon-list3" onclick="PF('OlymposMenu').changeBodyClass('');return false;"/>
                    <p:menuitem id="om_popup" url="#" value="Popup Menu Option" icon="icon-window32" onclick="PF('OlymposMenu').changeBodyClass('PopupMenu');return false;"/>
                    <p:menuitem id="om_slim" url="#" value="Slim Menu Option" icon="icon-list3" onclick="PF('OlymposMenu').changeBodyClass('SlimMenu');return false;"/>
                    <p:submenu id="om_colors" label="Color Options" icon="icon-blood10">
                        <p:menuitem id="om_bg_blue" url="#" value="Blue Color" icon="icon-chemistry10" onclick="PF('OlymposMenu').changeBodyClass('BlueTopbar');return false;"/>
                        <p:menuitem id="om_bg_navy" url="#" value="Navy Color" icon="icon-chemistry10" onclick="PF('OlymposMenu').changeBodyClass('NavyTopbar');return false;"/>
                    </p:submenu>
                </p:submenu>
            </po:menu>
            <po:menu id="menu3" title="Olympos Main Menu3" icon="icon-time32">
                <p:submenu id="om_hierarchy" label="MENU HIERARCHY">
                    <p:submenu id="om_sm1" label="Submenu 1" icon="icon-add5">
                        <p:submenu id="om_sm11" label="Submenu 1.1" icon="icon-add5">
                            <p:submenu id="om_sm111" label="Submenu 1.1.1" icon="icon-add5">
                                <p:menuitem id="om_lnk1111" value="Link 1" icon="icon-link21" url="#" />
                                <p:menuitem id="om_lnk1112" value="Link 2" icon="icon-link21" url="#" />
                                <p:menuitem id="om_lnk1113" value="Link 3" icon="icon-link21" url="#" />
                            </p:submenu>
                        </p:submenu>
                        <p:submenu id="om_sm12" label="Submenu 1.2" icon="icon-add5">
                            <p:submenu id="om_sm121" label="Submenu 1.2.1" icon="icon-add5">
                                <p:menuitem id="om_lnk1211" value="Link 1" icon="icon-link21" url="#" />
                                <p:menuitem id="om_lnk1212" value="Link 2" icon="icon-link21" url="#" />
                                <p:menuitem id="om_lnk1213" value="Link 3" icon="icon-link21" url="#" />
                            </p:submenu>
                        </p:submenu>
                    </p:submenu>
                </p:submenu>
            </po:menu>
        </po:tabmenu>
    </h:form>

</ui:composition>


Post Reply
  • Information
  • Who is online

    Users browsing this forum: No registered users and 1 guest