Tom*_*zyk 2 javascript jsf primefaces jsf-2
我需要验证(检查数字是否小于50000)html网站上的字段,某些形式的字段.
<p:inputText id="xid" styleClass="span3"value="#{user.xd}" maxlength="5" required="true">
// the validator does not work
<f:validateLongRange maximum="50000" minimum="1"/>
<p:clientValidator event="keyup"/>
</p:inputText>
Run Code Online (Sandbox Code Playgroud)
我需要在用户写入数据时验证它.我也在检查jQuery代码:
$(document).ready(function() {
$("#form").validate({
rules: {
xid: {
required: true,
maxlength: 5,
min: 1,
max: 50000
}
},
messages: {
xid: {
required: "This is mandatory. Either generated or manually entered!",
maxlength: "Max length is 5 digits",
max: "Max Value is 50000",
min: "Min is 1",
pattern: "Cannot contain characters nor starting with 0."
}
}
});
});
Run Code Online (Sandbox Code Playgroud)
解决方案中的问题是,当应用JSF时,表单的id不像"表单"那么简单 - 名称也包含":"而JavaScript无法处理它们.
忘记添加额外的jQuery代码,只需使用JSF验证器和PrimeFaces客户端验证器标签.您将看到输入字段对于大于50000的值变为红色.我个人倾向于使用该change事件而不是keyUp,我认为它更加用户友好:
<html xmlns="http://www.w3.org/1999/xhtml"
xmlns:h="http://xmlns.jcp.org/jsf/html"
xmlns:f="http://xmlns.jcp.org/jsf/core"
xmlns:p="http://primefaces.org/ui"
xmlns:comp="http://java.sun.com/jsf/composite/comp"
xmlns:ui="http://java.sun.com/jsf/facelets">
<h:head />
<h:body>
<h:form>
<p:messages autoUpdate="true" />
<p:inputText value="#{val}" maxlength="5" required="true">
<f:validateLongRange maximum="50000" minimum="1" />
<p:clientValidator event="change" />
</p:inputText>
<p:commandButton value="Check" />
</h:form>
</h:body>
</html>
Run Code Online (Sandbox Code Playgroud)
不要忘记在web.xml中启用客户端验证:
<context-param>
<param-name>primefaces.CLIENT_SIDE_VALIDATION</param-name>
<param-value>true</param-value>
</context-param>
Run Code Online (Sandbox Code Playgroud)
也可以看看:
| 归档时间: |
|
| 查看次数: |
3192 次 |
| 最近记录: |