Board index JavaServer Faces General Problem Using Layout

Problem Using Layout

Components, Ajax Framework, Utilities and More.

Post 10 Feb 2013, 13:32

Posts: 40
Location: Dhaka, Bangladesh
Hi All,

I have a problem with using layout component.

My Code is:

<p:layoutUnit position="north" size="100" resizable="true" closable="true" collapsible="true">
<p:menubar autoSubmenuDisplay="true">
<p:submenu label="Application Module" icon="ui-icon ui-icon-document">
<p:submenu label="Master Data" icon="ui-icon ui-icon-contact">
<p:menuitem value="Project" url="#" helpText="CTRL+N" />
<p:menuitem value="Other" url="#" helpText="CTRL+O"/>
</p:submenu>
</p:submenu>
<p:submenu label="Alert" icon="ui-icon-newwin">
<p:submenu label="New" icon="ui-icon ui-icon-contact">
<p:menuitem value="Project" url="#" helpText="CTRL+N" />
<p:menuitem value="Other" url="#" helpText="CTRL+O"/>
</p:submenu>
</p:submenu>

</p:menubar>
</p:layoutUnit>

<p:layoutUnit position="center">
Welcome to PrimeFaces
</p:layoutUnit>

Problem:
All menu items shows perfectly. but the menu items which are bottom, those menu items actually hide with "<p:layoutUnit position="center">" Center Layout.

I want to show all menu items on top of every layout.
Tanvir

PrimeFaces 3.5
GlassFish 3.1 | Google Chrome | NetBeans 7.2

Post 10 Feb 2013, 22:21

Posts: 6137
Howard

PrimeFaces 5.3, Extensions 4.0.0, Push (Atmosphere 2.4.0)
TomEE+ 1.7.4 (Tomcat 7.0.68), MyFaces Core 2.2.9, JDK8
JUEL 2.2.7 | OmniFaces | EclipseLink-JPA/Derby | Chrome

Java EE 6 Tutorial|NetBeans|Google|Stackoverflow|PrimeFaces|Apache

Post 11 Feb 2013, 04:43

Posts: 40
Location: Dhaka, Bangladesh
Yes, I have read those posts but unfortunately it does not work. I have use .css file and implement that but it does not work.

.ui-layout-pane-north .ui-layout-unit-content {
    overflow: visible;
}

.ui-menu, .ui-menubar, .ui-menuitem{
    z-index: 9999 !important;         
}

.pe-layout-pane-content {
                padding: 1ex;
                overflow: visible !important;
                border: none;
            }
Tanvir

PrimeFaces 3.5
GlassFish 3.1 | Google Chrome | NetBeans 7.2

Post 11 Feb 2013, 05:15

Posts: 6137
hmmm, you have no details in your profile signature like I do (below), so i can't tell what all you are using (primefaces version 3.5, primefaces extensions 0.6.x, ...).

anyway, why do you have the following, if you only have p:layout instead of pe:layout
.pe-layout-pane-content {
                padding: 1ex;
                overflow: visible !important;
                border: none;
            }


click URL below, look at how the menu works on that page, and then go to bottom of that page and click the hyperlink that says, View Page Source (layoutComplex.xhtml)

http://www.primefaces.org/showcase/ui/layoutComplex.jsf
Howard

PrimeFaces 5.3, Extensions 4.0.0, Push (Atmosphere 2.4.0)
TomEE+ 1.7.4 (Tomcat 7.0.68), MyFaces Core 2.2.9, JDK8
JUEL 2.2.7 | OmniFaces | EclipseLink-JPA/Derby | Chrome

Java EE 6 Tutorial|NetBeans|Google|Stackoverflow|PrimeFaces|Apache

Post 11 Feb 2013, 06:20

Posts: 40
Location: Dhaka, Bangladesh
Dear Friend,

It's work now. I am using primeface 3.4.2.

I have just add this block of code in my css file:

.ui-layout-north {
    z-index:20 !important;
    overflow:visible !important;
}


It's working fine.

Thank you so much Smith.
Tanvir

PrimeFaces 3.5
GlassFish 3.1 | Google Chrome | NetBeans 7.2

Post 11 Feb 2013, 07:36

Posts: 6137
you're welcome. please click on your user name in upper right corner of this page, go to user control panel, edit your signature.

copy/paste my signature and then change it to what you are using for your test/dev/production environment
Howard

PrimeFaces 5.3, Extensions 4.0.0, Push (Atmosphere 2.4.0)
TomEE+ 1.7.4 (Tomcat 7.0.68), MyFaces Core 2.2.9, JDK8
JUEL 2.2.7 | OmniFaces | EclipseLink-JPA/Derby | Chrome

Java EE 6 Tutorial|NetBeans|Google|Stackoverflow|PrimeFaces|Apache

Post 11 Feb 2013, 11:14

Posts: 40
Location: Dhaka, Bangladesh
Dear Friends,

I face a little problem for showing image as a Icon (Here I use an externale img). Though I have put path of my logo img but it does not show on the view.

<p:submenu icon="resources/img/logo.jpg" label=" GEO">


Is there any other way to show any logo to my menubar?

I already search some forum to get the answer. where there are lot of answers but unfortunately those are not work. I do not want to use library icon img.
Tanvir

PrimeFaces 3.5
GlassFish 3.1 | Google Chrome | NetBeans 7.2

Post 11 Feb 2013, 11:34

Posts: 40
Location: Dhaka, Bangladesh
I have find a solution to show image and work perfectly but which is not my required solution.

<p:graphicImage id="img" value="/resources/img/logo.jpg" />


I need to show img as submenu icon.
Tanvir

PrimeFaces 3.5
GlassFish 3.1 | Google Chrome | NetBeans 7.2

Post 11 Feb 2013, 13:11
kukeltje Expert Member

Posts: 8066
Location: Netherlands
new questions in new topics please
Ronald van Kuijk
______________________________
PrimeFaces 5.1, PrimeFaces plus 0.0.2 | JbossWildfly 8.1| Mojarra 2.2.8
Fedora 19, Firefox 26.0
Read the forum posting rules
Beginners: https://jsf.zeef.com/bauke.scholtz

Post 11 Feb 2013, 13:27

Posts: 40
Location: Dhaka, Bangladesh
Friends, Here the link for new topics as you suggest.
http://forum.primefaces.org/viewtopic.php?f=16&t=28511&p=90222#p90222
Tanvir

PrimeFaces 3.5
GlassFish 3.1 | Google Chrome | NetBeans 7.2

Next

Return to General