I have a Primefaces 5.0 modal dialog on a composite control. The dialog has a few field marked as required. When the button on the dialog is clicked I expected the client validation to fire and it seems it does as the backing bean is not called, but the messages are not displaying:
<p:dialog id="dialogCorporateShareHolder" header="Shareholder (Company)"
widgetVar="dlgCorporateShareHolder" modal="true">
<p:panelGrid columns="3" id="corporateShareHolderDetails">
<h:outputLabel for="companyName" value="Company name"/>
<p:inputText id="companyName" required="true"
value="#{cc.attrs.corporateShareHolder.companyName}"
label="Company name"/>
<p:message for="companyName"/>
<f:facet name="footer">
<p:commandButton id="submitCorporate" value="Submit"
update="corporateShareholders"
actionListener="#{cc.attrs.controller.addCorporateShareHolder}"/>
</f:facet>
</p:panelGrid>
</p:dialog>
The dialog displays, the validation gets called (I'm pretty sure), but no message is displayed.
You only need to update the p:message or a parent too, for example with
update="corporateShareholders corporateShareholderDetails"
Btw. I believe best practises are to
have the dialog(s) last in xhtml, outside of other forms
have a form inside the dialog itself
Related
I´m using o:ignoreValidationFailed, but it doesn´t work inside the ui:repeat. When I do the same outside, it works! I tried with mojarra ans MyFaces... I´m using primefaces. If there is another way to skip the validations only for one button...
<o:form id="rateplanEditByPeriod" prependId="false">
<p><p:messages id="mensagensDlg"/></p>
<p:tabView id="tabs">
<p:tab title="Cancelamento" id="tabCanc">
<h:panelGrid id="cancelationsTable" columns="2" cellpadding="10px" columnClasses="alignTop,alignTop">
<ui:repeat id="repeat" var="rest" value="#{rateplanByPeriodManaged.rateplanByPeriod.restriction.restTypeCancelation.restTypeCanConfs}" >
<h:panelGrid columns="8">
<p:inputText id="penaltyValue_#{loop.index}" value="#{rest.penalityValue}" style="width:28px" label="Valor" title="Valor" disabled="#{rest.noCancel}" required="true"/>
<p:commandLink id="add_#{loop.index}" actionListener="#{rateplanByPeriodManaged.addCancConf}" update=":rateplanEditByPeriod:tabs:cancelationsTable" partialSubmit="true" process=":rateplanEditByPeriod:tabs:cancelationsTable" value="+">
<o:ignoreValidationFailed />
</p:commandLink>
<p:commandLink actionListener="#{rateplanByPeriodManaged.removeCancConf(rest)}" value="-" update=":rateplanEditByPeriod:tabs:cancelationsTable" partialSubmit="true" process=":rateplanEditByPeriod:tabs:cancelationsTable">
<o:ignoreValidationFailed />
</p:commandLink>
</h:panelGrid>
</ui:repeat>
</h:panelGrid>
</p:tab>
</p:tabView>
<p:commandLink styleClass="button" onclick="dlgEdit.hide()" immediate="true" update=":msgsPanel">#{msgs['inventory.editByPeriod.cancel']}</p:commandLink>
<p:commandLink styleClass="button" actionListener="#{rateplanByPeriodManaged.editByPeriod(loginManaged.hotelSelected)}" oncomplete="if (!args.validationFailed) {dlgEdit.hide(); updateAllSearches(); updateAllNotifications();}" update="mensagensDlg, tabs" >#{msgs['inventory.editByPeriod.confirm']}</p:commandLink>
</o:form>
I have faced the same issue but with p:datatable
I solved it with
1- add a condition to the required field to know if the ajax come from submit button or not
as #Camilla said.
required="#{!empty param['trans_desc_form:savetransid']}"/>
trans_desc_form is the entire form id and savetransid is the submit button save id
2- I removed #NotNull from my JPA entity which force the validation
#JoinColumn(name = "ITEMNO", referencedColumnName = "ITEMNO")
#ManyToOne(optional = false, fetch = FetchType.LAZY)
//#NotNull
private Item item;
I have created a question for this issue
ignoreValidationFailed doesn´t work inside p:dataTable
I don´t know if it´s the best aproach but it worked for me...
<h: inputText id="text1" value="" required="#{!empty param['formName:btnSave']}" />
This is not the right way to have a "Cancel" button.
Just put process="#this" in the <p:commandLink>, or if you don't need to do any business logic, make it a normal <h:link> which reloads the page (and thus implicitly recreates the request/view scoped bean).
As to <o:ignoreValidationFailed> the failure in <ui:repeat> on its own, please create an issue.
I've been struggling with this for two days with no success and I think it's already time to ask for your help. But first of all, this is what I'm using:
JSF 2 Mojara 2.1.1
Primefaces 3.4.2
Netbeans 7.1.1
Tomcat 7.0.37
And now, the problem: I have a main page which is composed by several other pages using several <ui:include .. /> tags, like this:
<ui:composition template="/resources/templates/template1.xhtml">
<ui:define name="appData">
<p:panelGrid columns="1" id="contenidoAplicacion" styleClass="noborder">
<h:form id="fNewPerson">
<p:panel header="New employee" style="min-height:40em">
<ui:include src="./forms/personal.xhtml" />
<p:accordionPanel styleClass="noborder" activeIndex="3">
<p:tab id="tabSomeData" title="Identidad profesional" >
<ui:include src="./forms/formSomeData.xhtml" />
</p:tab>
....
....
</ui:define>
</ui:composition>
The personal.xhtm file looks like this:
<p:panelGrid>
<p:row>
<p:column >
<h:outputLabel value="Field1"/>
<p:inputText label="Field1" id="field1" value="#{dataBacking.selectedPerson.field1}" tabindex="1"
required="true" size="10" >
<f:convertNumber for="field1" integerOnly="true" groupingUsed="false"/>
</p:inputText>
<p:inputText id="field2" value="#{dataBacking.selectedPerson.field2}" tabindex="2" required="true" size="1" maxlength="1" >
<p:ajax event="keyup" listener="#{dataBacking.check}"
process="field1 field2" partialSubmit="true"
update="field1 field2 photo"/>
</p:inputText>
</p:column>
<p:column rowspan="5" >
<p:graphicImage id="photo" value="#{dataBacking.selectedPerson.photo}" width="90" />
</p:column>
</p:row>
...
</p:panelGrid>
The check() method in the dataBacking class is irrelevant because it only checks if the field1 and the field2 meet some rules and it works properly. The problem comes when the main page is loaded for the first time. In that case, the <p:ajax /> component in personal.xhtml doesn't work. I have to reload the page (simply by pressing the F5 key) and this time it works as it would be expected.
I've been changing some attributes of the component, but nothing seems to work. I really don't know what else to do. Any kind of help will be apreciated.
EDITED. After one more day, I think the problem has nothing to do with Primefaces ajax component, as the title of the question suggested. I've come to this conclusion through these two facts:
The behaviour with the <f:ajax .../> component remains the same.
I've figured out that the view relative to the first time I load the page is not persisted. I'll try to explain myself.
The DataBacking class has defined its scope as view so that the page can "see" all the attributes and methods during the time it's been shown to the user. However, I've noticed that the constructor is called twice: the first time the page is loaded (and then, none of the methods of the class are successfully invoked) and when I refresh the page. In this last case, the behaviour of both the page and the class is the expected one.
I have pop-up with h:selectOneMenu. This pop-up will be displayed on a4j:commandLink click.
h:selectOneMenu has "value" attribute is not getting called on pop-up render (I debugged it using System.out.println()).
Because of this value is not being updated on pop-up display, I am seeing last operation value, even though I want to see empty list on new operation.
Any suggestions?
Note: Another observation is, if "add" some button in pop-up which refreshes the h:selectOneMenu, then it is working fine.
My code looks something like this:
<rich:popupPanel id="CModalPanel"
autosized="true"
resizeable="false"
moveable="true" domElementAttachment="parent">
<f:facet name="header">
<h:outputText value="Select list"/>
</f:facet>
<h:form id="cListID">
<a4j:outputPanel id="panelID">
<h:panelGroup>
<h:selectOneMenu id="cListMenu"
value="#{myBean.currvalue}" >
<f:selectItems value="#{myBean.plistItems}" />
</h:selectOneMenu>
</h:panelGroup>
<h:panelGroup>
<a4j:commandLink id="refreshButton"
actionListener="#{anotherBean.addMethod}"
render=":cListID" >
</a4j:commandLink>
</h:panelGroup>
</a4j:outputPanel>
</h:form>
</rich:popupPanel>
You need to update the content of <rich:popupPanel> before opening it.
<a4j:commandLink ... render=":cListID" oncomplete="#{rich:component('CModalPanel')}.show()" />
here's a related bug https://community.jboss.org/thread/169542
So I have been stumped most of the day today trying to call a method in my backing bean when a component changes values. Everything works correctly if my components are outside of a <p:dialog>, however when nested inside a dialog the server side never happens. Originally I was working with the <p:calendar> control, but noticed it also didn't work with a simple inputText. The following example works:
<h:panelGrid columns="3">
<h:outputText value="Start"/>
<p:inputText id="startOfRange" value="#{myBean.startRange}" valueChangeListener="#{myBean.startChanged}">
<p:ajax event="change" update="play"/>
</p:inputText>
<h:outputText id="play" style="margin-left: 10px;" value="#{myBean.startRange}"/>
</h:panelGrid>
My backing bean method looks like
public void startChanged(ValueChangeEvent event) { }
This method is invoked after a tab out of the inputText, however when wrapped like the following the method never gets invoked:
<p:dialog widgetVar="efDlg" zindex="10" appendToBody="true" header="Create Custom Date Range"
modal="true" height="375" width="450" resizable="false" closable="false" >
<h:panelGrid columns="4">
<h:outputText value="Start"/>
<p:inputText id="startOfRange" value="#{myBean.startRange}" valueChangeListener="#{myBean.startChanged}">
<p:ajax event="change" update="play"/>
</p:inputText>
<h:outputText id="play" style="margin-left: 10px;" value="#{myBean.startRange}"/>
<p:inputText id="endOfRange" value="#{myBean.endRange}" valueChangeListener="#{myBean.endChanged}"/>
</h:panelGrid>
<div class="customRangeButtons">
<span>
<p:commandButton value="Cancel" onstart="efDlg.hide();" actionListener="#{myBean.cancelCustomDateRange}" update="pGraphs"/>
</span>
<span style="margin-left: 300px;">
<p:commandButton value="Ok" type="submit" onstart="efDlg.hide();" action="#{myBean.saveCustomDateRange()}" update="pGraphs"/>
</span>
</div>
</p:dialog>
Note I am using Primefaces 2.2.1 with Mojarra 2.1.0. Any ideas as to why I can't get the startChanged method to be called when the value has changed?
Maybe I'm wrong about this (I don't have my project code at home to verify) but isn't this:
<p:ajax event="change" update="play"/>
supposed to be:
<p:ajax event="valueChange" update="play"/>
I know that most of the Ajax event values are like the JavaScript event handlers with the 'on' removed, but valueChange is a special value in JSF Ajax tags.
For the record, I sometimes pair up two Ajax child tags inside an inputText, like:
<p:ajax event="valueChange" process="#this" update="whatever"/>
<p:ajax event="keyUp" process="#this" update="whatever"/>
This will deal with each keystroke at it is entered as well as copy-and-paste and loss of focus on the parent input text.
I have also come across the same problem. I am also using a single form and no form inside the dialog. As long as I do not have the appendToBody="true" for my dialog the input values and ajax and submit happens correctly. As soon as I add that attribute with true, for better/correct rendering, the input values are not accepted.
I have a page in jsf, where the user enters all the data and clicks on submit button, and it has to be saved in the database. Please find the code i'm currently using.
<h:column>
<f:facet name="header">
<h:outputText value="Registration"/>
</f:facet>
<h:form>
<h:commandLink id = "submit" value="submit" action="#{bean.submitDate}">
<f:param name="sNum" value="#{list.sNumber}" />
<f:param name="firstName" value="#{list.fName}" />
<f:param name="lastname" value="#{list.lName}" />
...
</h:commandLink></h:form>
</h:column>
i wanted know if i can send whole data at a time or I have to send all the fields individually itself as above
Although I don't see any input fields in your code snippet:
You can send all input elements together. Just let one single <h:form> ... </h:form> wrap all your input elements and use one h:commandLink or h:commandButton inside the form to submit all data together.