如何在p:工具提示中的p:消息中添加换行符

时间:2017-05-03 06:01:23

标签: jsf primefaces styles tooltip

我试图在密码提交的规则列表之间设置一个换行符:

希望此代码可以帮助您在本地计算机上重现它

我的JSF表单如下:

<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>

这就是我的bean的样子:

@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;
    }

}

基于SO的一些答案,我尝试通过引入特殊实体代码&#13;[![&#10;][1]][1]来修改验证消息,如下所示:

Password should contain&#13;Minimum 8 characters&#13;1 Uppercase alphabet&#13;&#10; 1 lower case alphabet and 1 special character

注意:此附加图片可能不会在少数浏览器中显示 This is how the the tooltip looks

1 个答案:

答案 0 :(得分:1)

为什么要在额外的工具提示中显示消息?看起来有点奇怪。

无论如何,你需要的是<br/>,你想要换行符并在你的p:消息中设置escape =“false”。

消息:

Password should contain&#13;Minimum 8 characters&#13;1 <br/> Uppercase Password...

XHTML:

<p:message for="password1" escape="false"/>

UPDATE1:

感谢Parkash Kumar提供更多信息以改善答案。

UPDATE2:

你也可以使用CSS和/n换行,然后你需要申请:

#messages td { white-space: pre; }

到您的CSS。