I am trying to put a line break between list of rules a password filed is supposed to have:
Hope this code would help you reproduce it on your local machines
My JSF form looks like:
<h:form id="passwordForm">
<div class="form-group has-feedback">
<p:password id="password1" value="#{testBean.password}"
required="true"
requiredMessage="This field cannot be left empty"
placeholder="Password">
</p:password>
<p:tooltip for="password1" id="password1ToolTip"
hideEvent="focus"
rendered="#{not empty facesContext.getMessageList('passwordForm:password1')}"
position="right" hideEffect="fade" showEffect="fade">
<p:message for="password1"/>
</p:tooltip>
</div>
</h:form>
This is how my bean looks:
@Named
@RequestScoped
public class TestBean implements Serializable {
private static final long serialVersionUID = 2016821444602021904L;
@Pattern(regexp = "^(?=.*[a-z])(?=.*[A-Z])(?=.*\d)(?=.*[$@$!%*?&])[A-Za-z\d$@$!%*?&]{8,}",
message = "Password should contain minimum 8 characters, 1 Uppercase alphabet, 1 lower case alphabet and 1 special character")
@Size(min = 8, message = "Password cannot be this short!")
private String password;
public void setPassword(String password) {
this.password = password;
}
public String getPassword() {
return password;
}
}
Based on a few answers on SO I have tried modifying the validation message by introducing special entity codes
and [![ ][1]][1]
as follows:
Password should contain Minimum 8 characters 1 Uppercase alphabet 1 lower case alphabet and 1 special character
Note: This attached image might not show up in a few browsers
Why you're showing the message in an extra tooltip? Looks a bit strange.
Anyway, what you need is a <br/>
where you want the line break and set escape="false"
in your p:message
.
message:
Password should contain Minimum 8 characters 1 <br/> Uppercase Password...
xhtml:
<p:message for="password1" escape="false"/>
UPDATE1:
Thanks to Parkash Kumar for the additional info to improve the answer.
UPDATE2:
You could also use CSS and /n
for a line break, then you need to apply:
#messages td { white-space: pre; }
to your CSS.