shale 为JSF 增加强大的前台数据验证功能

rockjava 2007-03-28
为 JSF 提供前台数据验证功能虽然 JSF 提供了强大的数据验证,但利用默认的 validator 只能提供后台数据验证功能,
没有提供对用户更加友好的前台数据验证功能。
不过没关系,我们可以利用 shale 为 JSF 增加强大的前台数据验证功能。
验证前需要下载 shale-core.jar 包和 commons-validator.jar,将这两个文件放到 WEB-INF/lib 目录下。
然后修改你的 form
<%@ taglib uri="http://struts.apache.org/shale/core" prefix="s" %>
<h:form onsubmit="return validateForm(this);">
   <h:inputText id="creditCardNumber" size="16" value="#{userContext.creditCardNumber}">
      <s:commonsValidator type="required" arg="#{msgs.creditCardNumberPrompt}" server="true" client="true"/>
      <s:commonsValidator type="mask" mask="[4-6].*" arg="#{msgs.creditCardNumberPrompt}" server="true" client="true"/>
      <s:commonsValidator type="creditCard" arg="#{msgs.creditCardNumberPrompt}" server="true">
</h:inputText> <h:message for="creditCardNumber" styleClass="errors"/>
<s:validatorScript functionName="validateForm"/>
</h:form>
只要改变一下提交方式然后增加 commonsValidator 组件和 validatorScript 组件就可以达到前台数据验证的功能了。
这里要提一下的是,容易遇到的一个问题是 commons-validator.jar 版本不对,
开始使用的是commons-validator.jar 的 1.1.4,会产生错误,换成 commons-validator.jar 的 1.2 版本就可以了。
还有如果有几个提交按钮,而只需要对其中的部分提交验证的话,只要改变相应的按钮的 onClick 事件就可以了,
比如 onclick="return validateForm(this.form)
具体的 <s:commonsValidator>中的type属性对应了commons Validator中的验证方法,
具体可以参考commons Validator官方网站的相关文档(http://jakarta.apache.org/commons/validator/index.html)

遗留问题:
在 myfaces 中提示信息如果是中文的话会被 myfaces 解析成 中国(中国) 这样的形式,
在网页中会很好的显示,但在 JavaScript 中 alert 出来会有问题,可以在页面上增加如下内容,
即可无侵入的解决JSF前台数据验证的中文问题,如果觉得放在每个页面中比较麻烦,
可增加至 <s:validatorScript/>标签中:
window._alert=window.alert;
window.alert=function(s) {
_alert(s.replace(/&#(\d{5});/g,function(r,r1) {return String.fromCharCode(r1);}));
}
ps:写出这个函数让我学到了几个 JavaScript 的 tip
1、 String 的 replace 方法的使用。
2、 String 的 replace 方法第二个参数可以是 Function 类型。
3、 String.toString() 方法加数字可以转换到相应的进制,比如要转换到 16 进制就可以 “111”.toString(16)
4、 String 的 fromCharCode 方法的使用
5、 正则表达式的匹配,$1…$n 是在 function 的第 1 至 n 个参数。
Global site tag (gtag.js) - Google Analytics