Primefaces Dialog box - show it conditionally. javascript code not working - primefaces

I want to show a dialog box on the click of a primefaces commandbutton. Before the dialog box , I need to check a condtional.
I am using Spring web-flow 2.3.0.
So I am doing it like this ,
And the Dialog Box is
I am not able to show this dialog box based on this condition.
Please help me ,any pointers?
SWF 2.3.0 Primefaces 2.2.1 JSF 2 Spring Security 3 Spring 3.1.0M1I EhCache Apache Tomcat 6.0 STS 2.5.1
So I have changed my code as per below
<p:commandLink id="addRequest" immediate="true" value="addreq"
oncomplete="dlg3.show()" update="dialogPanel">
<f:setPropertyActionListener
value="#{searchHandler.selectedAccIns}"
target="#{reqSearchHandler.checkAccStatus}" />
</p:commandLink>
And the dialog box is
<p:outputPanel id="dialogPanel"
rendered="#{not reqSearchHandler.accStatusFlag}">
<p:dialog header="Effect Dialog" widgetVar="dlg3"
showEffect="bounce" hideEffect="explode" height="200">
<h:outputText
value="Account is #{searchHandler.selectedAccIns.accStatusDesc}" />
<h:outputText value="Do you want to continue?" />
<div align="left">
<p:commandButton value="Yes" action="accept" />
<p:spacer width="960" height="5" />
<p:commandButton value="No" action="cancel" />
</div>
</p:dialog>
</p:outputPanel>
But when I am clicking on the command link , I am getting 3 dialog boxes. Can you please tell me why it is so?

Somebody else just posted the same problem! :)
You should use the oncomplete attribute instead of onclick of the commandButton. The click javascript event occurs before the page posts back, likely causing your dialog not to appear because of the page reloading.
oncomplete="dlg3.show()" will display the dialog AFTER the postback.

Related

Why are comopnents of another form validated with JSF 2.3?

I just upgraded to JSF 2.3 & Wildfly 14 (from 2.0 and 13) and primefaces 6.2.5.
I noticed a strange behavior when i use a command button. I have 2 forms and when a push the button of the first form, the input of the second form is validated and the error (in this case required errors) are displayed in a p:message :
<h:form id="form1" prependId="false">
<p:commandButton id="save" value="Save" actionListener="#{myBean.save()}" update="#form">
<f:actionListener binding="#{myBean.reloadResults()}" />
</p:commandButton>
<p:messages id="msgs" severity="error,warn" escape="false">
<p:autoUpdate />
</p:messages>
...
</h:form>
<p:dialog >
<h:form id="form2" >
<p:messages severity="error,warn" escape="false">
<p:autoUpdate />
</p:messages>
<div>
<p:calendar id="myDate" value="#{myBean.myDate}" required="true" />
</div>
...
</h:form>
</p:dialog>
I was expecting only the content of the first form to be processed and validated. This was the case with wildfly 13 and jsf 2.0.
Any idea?
You have not specified attribute process in your command button. Default value of this is #all which will validate all Forms.
Please use process="#form" to avoid validation and process of other form.
Updated code is as below:
<p:commandButton id="save" value="Save" actionListener="#{myBean.save()}" update="#form" process="#form">
<f:actionListener binding="#{myBean.reloadResults()}" />
</p:commandButton>
I have to apologize for not posting the entire code but it would have been to big. I found out what the problem was. It's related to this bug:
https://github.com/primefaces/primefaces/issues/4122
I have a panelgrid of 4 columns but with 10 elements in it.
The whole ajax communication was then broken. Fix is coming in PF 6.3

p:sticky not working in p:dialog

I can't seem to make p:sticky work inside a p:dialog :
my dialog xhtml :
<p:dialog modal="true" height="490" width="700" resizable="false" >
<h:form id="form">
<p:toolbar id="tb">
<p:toolbarGroup align="right">
<p:commandButton value="save" />
</p:toolbarGroup>
</p:toolbar>
<p:sticky target="form:tb" />
</h:form>
</p:dialog>
It works fine from a simple page. any thoughts?
You are not doing anything wrong, it is just not supported. And due to a 'bad' issue report, it is closed as invalid http://code.google.com/p/primefaces/issues/detail?id=6341
Looking at the javascript source code of the sticky component, it checks scrolling of the window and not any other part inside it. So there is a big chance it will also fail in e.g. a p:layout.

PrimeFaces dialog box not appearing

Iam using primefaces 4.0 .I want to use dialog box . When i used it its printing the dialog content in the same page on load itself .Dialog box not opening
<h:panelGrid columns="1" cellpadding="5">
<p:commandButton id="basic" value="Basic" onclick="dlg.show()" type="button" />
</h:panelGrid>
<p:dialog id="basicDialog" header="Basic Dialog" widgetVar="dlg1">
<h:outputText value="Resistance to PrimeFaces is futile!" />
</p:dialog>
also tried
in facesconfig.xml
org.primefaces.application.DialogActionListener
org.primefaces.application.DialogNavigationHandler
org.primefaces.application.DialogViewHandler
Thanks in advance
I missed adding
h:head
Thanks all for your response

Primefaces dialog doesn't close the second time

I use a dialog to show newsletters. The first time, everything goes ok: the dialog pops up and it can be closed using the X and using the extra button 'close'
<h:form id="frmDialog">
<p:dialog header="...: NEWS :..."
widgetVar="widgetInfo" modal="true" dynamic="true">
<p:commandButton value="close" onclick="widgetInfo.hide();"/>
<p:outputPanel id="pnlNewsLetter" style="width:610px;">
<ui:include src="#{corporateManager.newsLetter}"/>
</p:outputPanel>
</p:dialog>
</h:form>
....
When I click the button to reopen the same dialog, it opens, but can't be closed. In stead of closing, hitting the X button or the 'close' button, the entire content of the dialog gets selected and the page becomes inresponsive
.....
<h:form>
<h:commandButton image="/newsletters/img/1karel.png" onclick="widgetInfo.show();">
<f:ajax render=":frmDialog:pnlNewsLetter"/>
<f:setPropertyActionListener value="/newsletters/2012-12-21.html" target="#{corporateManager.newsLetter}"/>
</h:commandButton></h:form>
..... i've tried using p:commandButton, using oncomplete(), closable="false", used h:button, added/removed form-tags or id's etc...
Environment: Glasfish3.1.2 - Netbeans 7.3 - Primefaces 3.1 - Google Chrome 27.0.1453.94 m
Thanks to another post I've missed yesterday: dialog will not close primefaces ,
I've changed my code and it runs as expected, showing for each button another newsletter:
<p:commandButton oncomplete="widgetInfo.show();" value="" styleClass="karel4"
update=":pnlNewsLetter">
<f:setPropertyActionListener value="/newsletters/2013-03-19.html" target="#{corporateManager.newsLetter}"/>
</p:commandButton>
I had to remove <f:ajax render=":pnlNewsLetter"/> because otherwise the first newsletter was shown even when another button was clicked.
Many Thanks!

Primefaces 1.1 and p:dialog problem

I am using primefaces 1.1 + JSF 1.2 running in JBoss 5.1
I have a problem with p:dialog
Below are the code snippets taken from the showcase(of PF 2.2, yet the p:dialog code remains the same. Right?? ) which can be seen # http://www.primefaces.org/showcase/ui/dialog.jsf
Code:
<h:panelGrid cellpadding="5">
<p:commandButton value="Basic Dialog" onclick="dlg1.show()" type="button"/>
<p:commandButton value="Modal" onclick="dlg2.show();" type="button"/>
<p:commandButton value="Effects" onclick="dlg3.show();" type="button"/>
</h:panelGrid>
<p:dialog header="Basic Dialog" widgetVar="dlg1">
<h:outputText value="Resistance to PrimeFaces is futile!" />
</p:dialog>
<p:dialog header="Modal Dialog" widgetVar="dlg2" modal="true" height="200">
<h:outputText value="This is a Modal Dialog." />
</p:dialog>
<p:dialog header="Effect Dialog" widgetVar="dlg3" showEffect="bounce" hideEffect="explode" height="200">
<h:outputText value="This dialog has cool effects." />
</p:dialog>
The thing is, the outputText values within the dialog boxes are displayed along with the commandbuttons like the ordinady html contents rather than displayed inside a dialog box only when the commandButtons are clicked. What might be the issue? :shock:
P.S : The above code runs fine in Primefaces 2.2 + Jsf 2.0 + JBoss 6
SCREENSHOT -
problem image url