Usage of submenu / menuitem in main menu
-
- Posts: 1
- Joined: 21 May 2016, 02:59
This has a lot to do with the fact that the id in the <ul> element is hard-coded to "layout-menu". That id is used by the rel attribute on the layout-tab-menu links. This hard coding needs to be replaced with the id that is passed in to the menu component. MAJOR bug!!!
-
- Posts: 2
- Joined: 26 May 2016, 15:29
aragorn wrote:Hi everyone,
I'll override layout.js, MenuRenderer.java and Menu.java for you, but we do not consider adding this feature into next release. I'm working on this issue.
I also have this need. We bought the olympus Layout+Theme version.
Any chance we could get this modification as well ?
Thanks !
Oswin.
Yeah, I'm facing the same scenario and I would appreciate this improvement too..superticky77 wrote:aragorn wrote:Hi everyone,
I'll override layout.js, MenuRenderer.java and Menu.java for you, but we do not consider adding this feature into next release. I'm working on this issue.
I also have this need. We bought the olympus Layout+Theme version.
Any chance we could get this modification as well ?
Thanks !
Oswin.
Could it be possible to get it?
Thanks for your help!
-
- Posts: 1
- Joined: 08 Jul 2016, 16:47
- Location: Brazil
aragorn did the changes?
Multiple menus would be very very appreciated
Multiple menus would be very very appreciated
-
- Posts: 5
- Joined: 17 Mar 2016, 14:06
This is very important for my application, this was the main feature for the purchase of this theme + layout.
-
- Posts: 5281
- Joined: 29 Jun 2013, 12:38
Hi everyone,
Please try this jar;
https://www.dropbox.com/s/6r23bnj9st3wf ... 0.jar?dl=0
I tested it. It works fine for me. Please test it. If you see a problem, please write a comment about your issue.
Changes;
- added <po:tabmenu> component;
Exp;
- added events; tabChange and tabClose.
Exp;
- please use id attribute for statefull menu feature on po:menu
- in template.xhtml please use;
<h:outputScript name="js/newlayout.js" library="olympos-layout" />
instead of <h:outputScript name="js/layout.js" library="olympos-layout" />
Full Example;
- please add my custom jar into project.
Maven install code;
pom.xml
- use <h:outputScript name="js/newlayout.js" library="olympos-layout" /> instead of <h:outputScript name="js/layout.js" library="olympos-layout" />
- in layouttabmenu.xhtml
- in faces-config.xml
Screenshots;
Please try this jar;
https://www.dropbox.com/s/6r23bnj9st3wf ... 0.jar?dl=0
I tested it. It works fine for me. Please test it. If you see a problem, please write a comment about your issue.
Changes;
- added <po:tabmenu> component;
Exp;
Code: Select all
<po:tabmenu widgetVar="OlymposMenu">
<po:menu .../>
<po:menu ../>
...
<po:tabmenu>
Exp;
Code: Select all
<po:tabmenu widgetVar="OlymposMenu">
<p:ajax event="tabChange" oncomplete="console.log('tabchange')" />
<po:menu .../>
<po:menu ../>
...
<po:tabmenu>
- in template.xhtml please use;
<h:outputScript name="js/newlayout.js" library="olympos-layout" />
instead of <h:outputScript name="js/layout.js" library="olympos-layout" />
Full Example;
- please add my custom jar into project.
Maven install code;
Code: Select all
mvn install:install-file -Dfile=<path> -DgroupId=org.primefaces.themes -DartifactId=customMenu -Dversion=1.0-SNAPSHOT -Dpackaging=jar
Code: Select all
<dependency>
<groupId>org.primefaces.themes</groupId>
<artifactId>customMenu</artifactId>
<version>1.0-SNAPSHOT</version>
</dependency>
- in layouttabmenu.xhtml
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_dashboards" label="DASHBOARD">
<p:menuitem id="om_db_landing" value="Your Promotion Page" icon="icon-planet23" outcome="/promotion-page"/>
<p:menuitem id="om_db_sc" value="Dashboard Supply Chain" icon="icon-website22" outcome="/dashboard-supplychain.xhtml"/>
<p:menuitem id="om_db_b" value="Dashboard Banking" icon="icon-website22" outcome="/dashboard-banking.xhtml"/>
</p:submenu>
<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:menuitem id="om_bg_leaden" url="#" value="Leaden Color" icon="icon-chemistry10" onclick="PF('OlymposMenu').changeBodyClass('LeadenTopbar');return false;"/>
<p:menuitem id="om_bg_red" url="#" value="Red Color" icon="icon-chemistry10" onclick="PF('OlymposMenu').changeBodyClass('RedTopbar');return false;"/>
<p:menuitem id="om_bg_green" url="#" value="Green Color" icon="icon-chemistry10" onclick="PF('OlymposMenu').changeBodyClass('GreenTopbar');return false;"/>
<p:menuitem id="om_bg_yellow" url="#" value="Yellow Color" icon="icon-chemistry10" onclick="PF('OlymposMenu').changeBodyClass('YellowTopbar');return false;"/>
<p:menuitem id="om_bg_orange" url="#" value="Orange Color" icon="icon-chemistry10" onclick="PF('OlymposMenu').changeBodyClass('OrangeTopbar');return false;"/>
<p:menuitem id="om_bg_purple" url="#" value="Purple Color" icon="icon-chemistry10" onclick="PF('OlymposMenu').changeBodyClass('PurpleTopbar');return false;"/>
<p:menuitem id="om_bg_aqua" url="#" value="Aqua Color" icon="icon-chemistry10" onclick="PF('OlymposMenu').changeBodyClass('AquaTopbar');return false;"/>
</p:submenu>
</p:submenu>
<p:submenu id="om_theme" label="OLYMPOS THEME">
<p:menuitem id="om_sample" value="Sample Page" icon="icon-document126" outcome="/sample" />
<p:menuitem id="om_forms" value="Form Elements" icon="icon-checking1" outcome="/forms" />
<p:menuitem id="om_data" value="Data Components" icon="icon-time32" outcome="/data" />
<p:menuitem id="om_datatable" value="DataTable" icon="icon-notebook74" outcome="/datatable" />
<p:menuitem id="om_panels" value="Panels" icon="icon-browsers5" outcome="/panel" />
<p:menuitem id="om_overlays" value="Overlays" icon="icon-music-files" outcome="/overlay" />
<p:menuitem id="om_menus" value="Menus" icon="icon-hierarchical8" outcome="/menu" />
<p:menuitem id="om_messages" value="Messages" icon="icon-speech-bubble7" outcome="/messages" />
<p:menuitem id="om_charts" value="Charts" icon="icon-arrow68" outcome="/charts" />
<p:menuitem id="om_fileupload" value="FileUpload" icon="icon-statistic" outcome="/file" />
<p:menuitem id="om_misc" value="Misc" icon="icon-medical55" outcome="/misc" />
</p:submenu>
</po:menu>
<po:menu id="menu2" title="Olympos Main Menu2" icon="icon-triangular42">
<p:submenu id="om_default" label="DEFAULT PAGES">
<p:menuitem id="om_empty" value="Empty Page" icon="icon-add173" outcome="/empty-page" />
<p:menuitem id="om_login" value="Login Page" icon="icon-check61" outcome="/login" />
<p:menuitem id="om_error" value="Error Page" icon="icon-electronic58" outcome="/error" />
<p:menuitem id="om_404" value="404 Page" icon="icon-bandage" outcome="/404" />
<p:menuitem id="om_access" value="Access Denied Page" icon="icon-virtual2" outcome="/access-denied" />
</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:menuitem id="om_lnk12" value="Submenu 1.2" icon="icon-link21" url="#" />
<p:menuitem id="om_lnk13" value="Submenu 1.3" icon="icon-link21" url="#" />
</p:submenu>
<p:submenu id="om_sm2" label="Submenu 2" icon="icon-add5">
<p:submenu id="om_21" label="Submenu 2.1" icon="icon-add5">
<p:submenu id="om_211" label="Submenu 2.1.1" icon="icon-add5">
<p:menuitem id="om_lnk2111" value="Link 1" icon="icon-link21" url="#" />
<p:menuitem id="om_lnk2112" value="Link 2" icon="icon-link21" url="#" />
<p:menuitem id="om_lnk2113" value="Link 3" icon="icon-link21" url="#" />
</p:submenu>
</p:submenu>
</p:submenu>
</p:submenu>
<p:submenu id="om_fonticon" label="FONT ICON">
<p:menuitem id="om_icons" value="Font Icons" icon="icon-planet23" outcome="/font-icons" />
</p:submenu>
</po:menu>
</po:tabmenu>
</h:form>
</ui:composition>
Code: Select all
<?xml version="1.0" encoding="utf-8"?>
<faces-config version="2.0" xmlns="http://java.sun.com/xml/ns/javaee"
xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
xsi:schemaLocation="http://java.sun.com/xml/ns/javaee http://java.sun.com/xml/ns/javaee/web-facesconfig_2_0.xsd">
</faces-config>
Github Profile: https://github.com/mertsincan
-
- Information
-
Who is online
Users browsing this forum: No registered users and 13 guests