Why is my custom selectOneRadio layout not working with PrimeFaces 5.1? - primefaces

I'm migrating my project from version 5.0 to version 5.1 of PrimeFaces.
I have a p:selectOneRadio with custom layout that works fine with version 5.0 but not with 5.1.
It seems that the itemIndex is not working.
This is my layout:
<p:selectOneRadio id="incidentRadio" value="#{backingBean.option}" layout="custom">
<f:selectItem itemLabel="existingIncident" itemValue="existingIncident" />
<f:selectItem itemLabel="newIncident" itemValue="newIncident" />
</p:selectOneRadio>
...
<p:radioButton id="optIncident1" for="incidentRadio" itemIndex="0"/>
<h:outputLabel for="optIncident1" value="existingIncident" />
...
<p:radioButton id="optIncident2" for="incidentRadio" itemIndex="1"/>
<h:outputLabel for="optIncident2" value="newIncident" />
The behaviour is the following:
When I select the first radio button (optIncident1), it actually passes the value of the second radio button (optIncident2) to the backing bean.
When I select the second button, it gives me a validation error:
formactionCall:tabViewCall:incidentRadio: Validation Error: Value is not valid
Is this a bug in 5.1?
I am using Jboss 7.1.1.Final with javax.faces-2.1.12.

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

Not Disable the entire screen during ajax request

I want not show blocked screen with its gif, for every ajax call, I want to prevent this behaviour for some compoments and events like this:
<p:selectBooleanCheckbox id="checking" value="#{data.selected}">
<p:ajax update=":fG:pG" listener="#{backBean.selecteData(dato,cont)}" event="change" />
</p:selectBooleanCheckbox>
I'm guessing you're using a p:ajaxStatus.
In that case you can use global="false" to avoid triggering the ajaxStatus.
For example:
<p:ajax global="false"... />
<p:commandButton global="false"... />
Edit: For me it works in Primefaces 6.1, but not in 5.3 (even though it was documented in the docs). Haven't tested 6.0.

How to make "p:remoteCommand" to trigger "p:ajaxStatus"?

Have the following issue: there is p:remoteCommand that lazy loads p:dataTable after page load, but the load indicator of "p:ajaxStatus" is not shown during the time of the ajax request...
How to make "p:ajaxStatus" to be shown on the page when p:remoteCommand sends request for lazy loading of the data?
Code on the page:
<h:form id="form">
<p:remoteCommand name="loadLazyData" action="#{crmBackingBean.crmOnControlLazyInit}" autoRun="true" process="#this" update="dtCrmOnControl" />
<p:dataTable id="dtCrmOnControl" var="rowData" value="#{crmBackingBean.crmOnControlLazy}" widgetVar="dtCrmOnControl" rows="#{crmBackingBean.crmDTonControlRows}" paginator="true" ..... lazy="true" >
.......................................................
</p:dataTable>
</h:form>
I use Atlas theme, p:ajaxStatus is located in its original place, in template.xhtml:
<p:ajaxStatus style="width:40px; height:40px; position:fixed; right:30px; bottom:30px; z-index:999999;">
<f:facet name="start">
<i class="fa fa-circle-o-notch fa-spin Green Fs40"></i>
</f:facet>
<f:facet name="complete">
<h:outputText value="" />
</f:facet>
</p:ajaxStatus>
Thank you!
Versions: PrimeFaces 6.0.2; PrimeFaces Atlas Theme 1.1.1; GlassFish 4.1.1 with JSF 2.2.12 (Mojarra)
The solutions is following:
The tag <p:ajaxStatus> should be placed on the xhtml source page BEFORE tag <p:remoteCommand>.
Environment:
PrimeFaces 6.0.2
PrimeFaces Atlas Theme 1.1.1
GlassFish 4.1.1 with JSF 2.2.12 (Mojarra)
it seems like you've missed a few essential defintions. How should your status notice that there is any action going on? Also, I suppose you'd like to display a dialog during waiting and configure its styling in ajaxStatus, is that correct?
If so, I recommend you to create an own dialog by <p:dialog> and add the onstart and onsuccess attributes to your ajaxStatus as described in Primefaces showcase: http://www.primefaces.org/showcase/ui/ajax/status.xhtml
It will be something like
<p:ajaxStatus onstart="PF('statusDialog').show()" onsuccess="PF('statusDialog').hide()" />
<p:dialog widgetVar="statusDialog" modal="true" draggable="false" closable="false" resizable="false" showHeader="false">
<p:graphicImage name="waiting_picture.gif" />
</p:dialog>
You can easily combine this solution with a datatable / paginator.
I hope this helps!
EDIT: Why don't you define the rows per page to support lazy loading?
http://www.primefaces.org/showcase/ui/data/datatable/paginator.xhtml
EDIT 2: You can also call your loadLazyData method on start:
<p:ajaxStatus onstart="loadLazyData" />
or something like this...

How to make selection and Edit Row working in Primefaces 4.0

I am completely new to Primefaces and jsf. I am facing problems in selection of row and editing row together. I have datatable.
<p:dataTable var="adminFileConfiguartionModel" value="#{adminFileController.adminFileConfigDataModel}" id="adminFileConfigID" editable="true" selection="#{adminFileController.adminFileSelectList}">
<p:ajax event="rowEdit" listener="#{adminFileController.onEdit}" update=":fileConfigForm:messages,:fileConfigurationForm:adminFileConfigID" />
<p:column id="checkBox" selectionMode="multiple" style="width:2%" />
'adminFileSelectList' is ArrayList .. when i complete editing part ,checked box is unchecked but still after submitting button previous value is stored in rowKey ..which i get from getRowData(String rowKey)... how to nullify that previous value..

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

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.