Prime Community Forum

Posted: **30 Jun 2012, 06:17**

Hi,

My main ui contain 2 layout panels:
The West panel contained the menu bar and center will show the relevant jsf according to the selected menu:
small example:

Code: Select all

<h:form id="mainForm">
                <pe:layoutPane position="west" size="'16%'">  
                    <h:panelGroup id="menu">
                        <ui:include src="menu_bar.xhtml"/>
                    </h:panelGroup>
                </pe:layoutPane>  
                <pe:layoutPane position="center" size="'84%'">  
                    <h:panelGroup id="content">
                        <h:panelGroup rendered="${bean.menuName == dy_messages.OS}">
                            <ui:include src="first.xhtml"/>
                        </h:panelGroup>

In the first jsf I am using 2 dialogs that will popup one on the right side and the second on the left side of the screen.
Apparently when I activate the left p:dialog then the menu bar is "squashing" the dialog and the only way to see the all left dialog screen is by closing the menu bar panel.

Any suggestion why and how can i solve this issue ?

Thanks

Posted: **30 Jun 2012, 09:58**

Moved to extensions forum.

Posted: **30 Jun 2012, 18:11**

This is well know and not an issue. The best way to solve this kind of issues is to place dialogs outside of layout. This is valid for p:layout or pe:layout, don't matter. Place dialogs after layout tag, close to body tag. Alternative you can set appendToBody="true" on dialog.

Posted: **02 Jul 2012, 01:53**

Regarding changing the dialog location I cant do it sine the dialog is part of the include file.
I try the appendToBode=true and it's working if the dialog include text for example:

Code: Select all

<p:dialog id="sqlDialog"
                  header="SQL Detail" 
                  widgetVar="sqlDialog"  
                  width="800" 
                  hideEffect="clip"
                  position="center"
                  appendToBody="true">
            <h:outputText value="dswdw/t"/>           
        </p:dialog>

But in my case the dialog include pe:codeMirror

Code: Select all

 <p:dialog id="dialog1" 
                  header="Detail" 
                  widgetVar="Dialog"  
                  width="800"  
                  hideEffect="clip"
                  position="left"
                  appendToBody="true">  
            <pe:codeMirror id="xml" 
                           mode="xml" 
                           readOnly="true" 
                           theme="eclipse" 
                           value="#{bean.selectedOS.xml}" 
                           lineNumbers="false"
                           lineWrapping="false"/>

Which gives me the following error:

Webpage error details

User Agent: Mozilla/4.0 (compatible; MSIE 8.0; Windows NT 6.1; WOW64; Trident/4.0; SLCC2; .NET CLR 2.0.50727; .NET CLR 3.5.30729; .NET CLR 3.0.30729; Media Center PC 6.0; MS-RTC LM 8; InfoPath.3; .NET4.0C; .NET4.0E)
Timestamp: Sun, 1 Jul 2012 23:36:39 UTC

Message: 'this.form.0.id' is null or not an object
Line: 4088
Char: 3
Code: 0
.....javax.faces.resource/codemirror/codemirror.js.jsf?ln=primefaces-extensions-uncompressed&v=0.4.0

Message: Object doesn't support this property or method
Line: 2
Char: 1
Code: 0

Message: Could not complete the operation due to error 80020101.
Line: 16
Char: 5884
Code: 0
..../javax.faces.resource/jquery/jquery.js.jsf?ln=primefaces&v=3.2

I guess it's because of the update in command button:

Code: Select all

  <p:commandButton id="Button1" 
                                 value="View" 
                                 icon="ui-icon-search"
                                 oncomplete="dialog1.show()"
                                 update=":mainForm:xml"
                                 style="float: right"/>

This piece of code was working great before adding the appendToBody.

Posted: **02 Jul 2012, 09:43**

If you use appendToBody="true", you should have a form (h:form) inside dialog. This is a main rule and was discussed in the PrimeFaces core forum. So, you should surround pe:codeMirror with a h:form.

Posted: **02 Jul 2012, 15:18**

i add the h:form and indeed it's working but ...
unfortunately i now get duplicate dialog's :{
after refreshing the screen the duplicate is disappear

I will open a new post on this issue

Thanks for the help.

Prime Community Forum

<pe:layoutPane is "squash" p:dialog

<pe:layoutPane is "squash" p:dialog

Re: <pe:layoutPane is "squash" p:dialog

Re: <pe:layoutPane is "squash" p:dialog

Re: <pe:layoutPane is "squash" p:dialog

Re: <pe:layoutPane is "squash" p:dialog

Re: <pe:layoutPane is "squash" p:dialog