CSDN博客

img yarshray

JSF 的客户端验证框架

发表于2007/10/31 15:45:00  3460人阅读

   如果用过Struts框架的朋友们可能会觉得Struts框架的验证设计的非常精致,因为它可以针对每一个ActionForm的字段进行验证。可是在标准JSF框架提供的验证就显得有些片

面了,使得开发JSF应用程序需要做更多的工作。那么接下来,我将为大家介绍一组非常方便的JSF扩展组件,这一组组件是专门用来做验证框架的。下面我们将通过以下几个主题

来了解这组框架的使用过程:
 1 clientvalidators扩展框架的验证流程
 2 clientvalidators扩展框架的使用步骤
 3 clientvalidators框架的使用说明

clientvalidators扩展框架的验证流程

    JSF框架和Struts框架一个很重要的不同在于,JSF采用了以视图组件为中心的MVC设计模式,每次提交页面的时候会把视图组件的状态传递到服务器,因此其验证也就不会像

Struts那样验证JavaBean(ActionForm Bean)了,而是验证输入视图组件的状态。那么clientvalidators又是如何处理的呢?它如其名,它是采用客户端的脚本来验证的,因此它会

生成客户端的Javascript脚本。在clientvalidators使用提供的标签后,会在客户端生成如下脚本:
<SCRIPT language="JavaScript" SRC="validatorResource.jsf?name=clientvalidators&type=js"></SCRIPT>
<SCRIPT language="javascript">
function validate() {
var vs = new Object();
vs.popup = true;
vs.summary = '';
var isFormValid=true;
clearValidationSummary(vs);
retVal=validateRequiredField('form1:txtName','form1:_id0',false,'dynamic');
addErrorToSummaryIfNecessary(retVal,'form1:_id0',vs);
isFormValid=isFormValid && retVal;
showPopupIfNecessary(vs);
return isFormValid;
}

</SCRIPT>
     通过如下脚本,我们可以看见这一validatorResource.jsf?name=clientvalidators&type=js段代码,这段代码用来返回clientvalidators提供的六种验证规则的客户端脚本

。而下面的一段脚本则是提供了用于提交时候的验证的validate()调用接口。这个调用接口主要执行了两个操作,一个是执行验证逻辑,另一个是打印验证结果。
    
clientvalidators扩展框架的使用步骤
     我们先到http://sourceforge.net/project/showfiles.php?group_id=137466&package_id=188253&release_id=421432 这个地址下载clientvalidators扩展框架。
     接下来我们了解一下如何通过clientvalidators来开发应用程序。我们知道JSF是通过标签来开发用户接口和界面逻辑的,因此clientvalidators也提供了六个标签完成应用

的。另外由于在客户端要请求脚本,所以需要web提供监听器来完成这个执行过程。那么我们的开发步骤如下:
 1 在web.xml中加入:
 <listener>
  <listener-class>
   com.sun.faces.config.ConfigureListener
  </listener-class>
 </listener>
 2 提供资源文件
   2.1 在faces-config.xml中提供资源文件,例如:
   <application>
  <message-bundle>ApplicationMessages</message-bundle>
  <locale-config>
   <default-locale>zh</default-locale>
  </locale-config>
   </application>
   2.2 在classes中加入资源文件,其中资源键包括:
   CV_REQUIRED_FIELD_VALIDATOR_ERROR = Value is required #必须输入的验证异常消息
   CV_COMPARE_VALIDATOR_ERROR = Value comparison failed #比较输入的验证异常消息
   CV_RANGE_VALIDATOR_ERROR = Range validation failed #指定输入范围的验证异常消息
   CV_REGULAR_EXPRESSION_VALIDATOR_ERROR = Reqular expression validation failed #正则表达式的验证异常消息
   CV_LENGTH_VALIDATOR_ERROR = Length validation failed #输入长度的验证异常消息
 3 在jsp页面中调入标签库
 <%@ taglib
  uri="http://sourceforge.net/projects/jsf-comp/clientvalidators"
  prefix="cv"%>
 4 在jsp页面使用 标签。


     下面我们来看一个例子,这个例子中我们要求用户输入一个名字,这个名字是必须输入。
  <f:view>
   <h:form id="form1">
    <h:inputText id="txtName" value="#{ValidatorForm.name}" />
    <cv:requiredFieldValidator componentToValidate="txtName"
     display="dynamic" />
    <h:commandButton value="Save" onclick="return validate();" action="#{ValidatorForm.evt_Save}"/>
     reRender="outmsg" />
    <cv:scriptGenerator form="form1" popup="true" />
   </h:form>
   <h:outputText id="outmsg" value="#{ValidatorForm.outmsg}" />
  </f:view>
    在这个例子中,cv作为前缀的标签,就是clientvalidators扩展框架提供的标签。<cv:requiredFieldValidator>标签表示必须输入的验证,componentToValidate属性表示要

验证的输入组件的id,display表示要用那种形式的样式的<div>输出,只要有两种static和dynamic。<cv:scriptGenerator> 标签用来生客户段验证脚本,form属性表示那个form

要验证,popup表示是否弹出验证错误消息对话框。
注:在richjsf中<a4j:commandButton>标签也是使用客户端代码的,所以在onclick事件中要注意执行流程的控制。以下是我建议的一种验证事件写法:
    <a4j:commandButton value="Hello" onclick="if(!validate())return" action="#{ValidatorForm.evt_Save}" reRender="outmsg" />

clientvalidators框架的使用说明
    <cv:requiredFieldValidator>表示必须输入的验证
    <cv:rangeValidator>表示指定范围的验证,minValue,maxValue属性分别表示最小和最大值的范围
    <cv:compareValidator>表示比较输入的验证,componentToCompare属性表示要比较的输入组件的id,operator属性表示比较操作主要有eq和not
    <cv:regularExpressionValidator>表示正则表达式的验证,pattern属性用来输入正则表达式
    <cv:lengthValidator>表示长度验证,min和max属性表示最小和最大长度的值
    <cv:customValidator>表示用户自定义验证方法,function表示用户自定义的脚本函数,params指定要验证的输入组件的客户端id,errorMessage表示输入错误的提示信息

参考文档:
   clientvalidators官方文档:  http://jsf-comp.sourceforge.net/components/clientvalidators/index.html

 

 

 

 

阅读全文
0 0

相关文章推荐

img
取 消
img