I'm using Primefaces, and have a login dialog:
<p:dialog widgetVar="dlgLogin" header="Login" modal="true">
<p:outputPanel>
<h:form>
<p:messages for="msgLogin" autoUpdate="true" closable="true" showSummary="true" showDetail="false" severity="error"/>
<p:panel>
<h:panelGrid columns="2">
<p:outputLabel value="User Name"/>
<p:inputText id="userName" value="#{loginBean.userName}"
required="true" requiredMessage="User Name is required"/>
<p:outputLabel value="Password"/>
<p:password id="password" value="#{loginBean.password}"
required="true" requiredMessage="Password is required"/>
</h:panelGrid>
</p:panel>
<p:commandButton icon="ui-icon-arrowrefresh-1-n" value="Cancel" onclick="PF('dlgLogin').hide()"/>
<p:commandButton type="submit" value="Login"
ajax="false" validateClient="true"
oncomplete="handleClose(xhr, status, args);"
action="#{loginBean.login}"/>
</h:form>
</p:outputPanel>
</p:dialog>
Submitting the login is on purpose non ajax, so the entire page will be refreshed.
The server code is:
FacesContext.getCurrentInstance().addMessage("msgLogin", new FacesMessage(FacesMessage.SEVERITY_ERROR, "Wrong User Name or Password.", "Wrong User Name or Password."));
In case that the login fails in the server, I would like to display a message, and leave the dialog open. but it doesn't work.
How can that be done?
Thanks.
Don't close the dialog in JSF but in Java:
if (successfulLogin) {
RequestContext.execute("PF('dlgLogin').hide()");
} else {
FacesContext.getCurrentInstance().addMessage("msgLogin", new FacesMessage(FacesMessage.SEVERITY_ERROR, "Wrong User Name or Password.", "Wrong User Name or Password."));
}
Related
I'm using PrimeFaces 4.0 and I'm trying to use a dialog to change password.
I used password component to do this job It does n't work in a dialog but It works fine when I'm not using Dialog.
Here is my code
<h:form>
<p:dialog widgetVar="changePw" resizable="true" appendTo="#(body)"
modal="true" closable="false" id="changePw">
<p:panel header="change password">
<p:messages id="messages" showDetail="true" showSummary="false"
autoUpdate="true" />
<h:panelGrid columns="2" id="matchGrid">
<h:outputLabel for="pwdNew" value="New: *" />
<p:password id="pwdNew" value="#{passwordBean.newPw}" feedback="true"
match="pwdConf" required="true"
validatorMessage="Pw does n't matches"
requiredMessage="Value required">
</p:password>
<p:messages showDetail="true" showSummary="false" autoUpdate="true"
for="pwdNew" />
<h:outputLabel for="pwdConf" value="Confirm Password: *" />
<p:password id="pwdConf" value="#{passwordBean.newPwConfirmation}"
feedback="true" required="true"
validatorMessage="invalid password"
requiredMessage="Value required">
<f:validateRegex pattern="[A-Za-z0-9]{8,60}" />
</p:password>
</h:panelGrid>
</p:panel>
<p:separator></p:separator>
<p:commandButton value="Save" update="matchGrid"
process="#this" ajax="true"
actionListener="#{passwordBean.changePw}"
styleClass="ui-confirmdialog-yes"
oncomplete="changePw.hide();"
icon="ui-icon-check" />
<p:commandButton value="Cancel" process="#this"
onclick="changePw.hide();" styleClass="ui-confirmdialog-no"
icon="ui-icon-close" />
</p:dialog>
...
Thank for any suggestion !
If you use a 'appendTo="#(body)"', you need a form IN the dialog as can be read in the PrimeFaces documentation. But make sure that it is in the original xhtml NOT nested!
In addition, the process="#this" on the buttons prevent the other inputs to be submitted (this also won't work outside the dialog, so you most likely did not have that there). So remove that as well
I have a Form to add a new user. I am using Validator messages to control empty fields. If I enter invalid data and submit the form, error messages were displayed. After that I click on reset button, it doesn't work.
This my code in html:
<h:form id="newCustomerForm">
<p:dialog draggable="true" header="New Customer" widgetVar="customerDialogNew" resizable="false"
showEffect="clip" hideEffect="fold" style="position: absolute ;" id="dialog2">
<p:panelGrid id="newCustomer" columns="6" >
<f:facet name="header">
<p:graphicImage value="../../pictures/customerAdd.jpg"/>
</f:facet>
<p:outputLabel value="Name:" for="name" />
<p:inputText id="name" value="#{customerMB.name}" title="Name" required="true" requiredMessage="The Name field is required."/>
<p:message for="name" />
<p:outputLabel value="FamilyName:" for="familyName" />
<p:inputText id="familyName" value="#{customerMB.familyName}" title="FamilyName" required="true" requiredMessage="The FamilyName field is required."/>
<p:message for="familyName" />
</p:panelGrid>
<p:commandButton type="reset" immediate="true" update="newCustomerForm" value="Clear" icon="ui-icon-arrowrefresh-1-n" styleClass="ui-priority-primary">
</p:commandButton>
<p:commandButton value="Save" ajax="false" icon="ui-icon-circle-check" styleClass="ui-priority-primary" action="#{customerMB.addCustomer()}" />
</p:dialog>
</h:form>
How can I show all validation messages in one pop up using growl, because by default every validation message on the client side creates new pop up.
Of course I could do validation on the server side and send final message to the growl but is it possible to do it on the client side?
Some code goes here:
<p:dialog id="chPwD" header="#{res['user.passwordDialogHeader']}" widgetVar="changePwV" closeOnEscape="true" resizable="false">
<p:growl id="growl" showDetail="false" life="3000" />
<h:panelGrid id="chPwPG" columns="1" cellpadding="1" transient="true">
<h:panelGrid id="chPwPGi" columns="2" cellpadding="1">
<p:outputLabel for="pwd0" value="#{res['user.oldPassword']}" />
<h:panelGroup>
<p:password id="pwd0" label="#{res['user.oldPassword']}" value="#{mngr.oldPassword}" required="true" style="width:250px;"/>
<span style="display:inline-block;"><p:message for="pwd0"/><p:messages for="pwd0"/></span>
</h:panelGroup>
<p:outputLabel for="pwd1" value="#{res['user.newPassword']}" />
<h:panelGroup>
<p:password id="pwd1" label="#{res['user.newPassword']}" value="#{mngr.newPassword}" match="pwd2" required="true" style="width:250px;"/>
<span style="display:inline-block;"><p:message for="pwd1"/></span>
</h:panelGroup>
<p:outputLabel for="pwd2" value="#{res['user.repeatNewPassword']}" />
<h:panelGroup>
<p:password id="pwd2" label="#{res['user.repeatNewPassword']}" value="#{mngr.newPassword}" required="true" style="width:250px;"/>
<span style="display:inline-block;"><p:message for="pwd2"/></span>
</h:panelGroup>
</h:panelGrid>
</h:panelGrid>
<f:facet name="footer">
<p:commandButton value="#{res['btn.apply']}" style="margin-right:20px;" update=":chPwPG" action="#{mngr.changeSelectedUserPassword}" oncomplete="handlePwChangeRequest(xhr, status, args)"/>
<p:commandButton value="#{res['btn.cancel']}" onclick="changePwV.hide();" type="button"/>
</f:facet>
</p:dialog>
you should try <p:messages showDetail="false" showSummary="true"/> and it work for me.
My sample form is given blow. When I click on the "Login" button, validation message is shown for the userName field as immediate="true".
And when I click on the "Forgot Password" button, page is directed to my success page. As immediate=true present for button and userName input field, I am expecting required field validation on user name. But this is not the case.
Am I missing anything in this code?
<h:form>
<h:panelGrid columns="3">
<h:outputText value="User Name" for="userName" />
<h:inputText id="userName" value="#{myBean.userName}" required="true"
requiredMessage="User Name is required" immediate="true"
binding="#{myBean.userNameText}"></h:inputText>
<h:message for="userName" />
<h:outputText value="User Password" for="userPwd" />
<h:inputText id="userPwd" value="#{myBean.userPwd}" required="true"
requiredMessage="User Password is required"
binding="#{myBean.userPwdText}">
</h:inputText>
<h:message for="userPwd" />
<h:commandButton value="Login" action="#{myBean.action()}"></h:commandButton>
<h:commandButton value="Forgot Password" action="#{myBean.action()}"
immediate="true"></h:commandButton>
</h:panelGrid>
</h:form>
In my previous question I had the problem of displaying validation messages from a Login form. That issue is now solved, but this time I am not able to display a custom message with FacesContex#addMessage.
Using JSF + PrimeFaces.
<p:dialog header="Login" widgetVar="loginDlg">
<h:form id="loginForm">
<h:panelGrid columns="3" cellpadding="5">
<h:outputLabel for="username" value="Username:" />
<p:inputText value="#{loginBean.username}" id="username" required="true" label="username" />
<p:message for="username" />
<h:outputLabel for="password" value="Password:" />
<h:inputSecret value="#{loginBean.password}" id="password" required="true" label="password" />
<p:message for="password" />
<f:facet name="footer">
<p:commandButton value="Login" id="loginDlgButton" update=":loginForm,:welcomeMsg" actionListener="#{loginBean.login}"
oncomplete="handleLoginRequest(xhr, status, args)"/>
<p:message for="loginDlgButton" />
</f:facet>
</h:panelGrid>
</h:form>
</p:dialog>
In LoginBean (a SessionScoped ManagedBean):
public void login() {
FacesContext context = FacesContext.getCurrentInstance();
RequestContext rContext = RequestContext.getCurrentInstance();
HttpServletRequest request = (HttpServletRequest) context.getExternalContext().getRequest();
try {
request.login(this.username, this.password);
rContext.addCallbackParam("loggedIn", true);
} catch (ServletException e) {
rContext.addCallbackParam("loggedIn", false);
context.addMessage(null, new FacesMessage(FacesMessage.SEVERITY_WARN, "Login Error", "Invalid credentials"));
}
}
This code, when validation succeeds and login fails, should display the "Invalid credential" message, but doesn't. Moreover, somewhere in the body of my web page, I have also added this line:
<p:messages autoUpdate="true" />
but my message isn't displayed even there.
Javadocs say that
If clientId is null, this FacesMessage is assumed to not be associated with any specific component instance
But I can't understand what this means.
place <p:messages autoUpdate="true" /> inside your form or inside some wrapper that is being updated by update of your commandButton , or place loginDlgButton instead of null in context.addMessage(...
I don't see a p:messages tag in your code. It is not the same as the p:message tag. p:message is attached to another component and is displayed as part of validation. The p:messages (or p:growl) component is what you are updating in your bean. Try adding a messages or growl component like this:
<h:form id="loginForm">
<p:growl id="messageGrowl" showDetail="true" sticky="false" />
<h:panelGrid columns="3" cellpadding="5">