http://blog.youkuaiyun.com/wzw_wxx/archive/2007/01/03/1472991.aspx
http://www.qqread.com/jsp/f761108012_4.html
http://www.iteye.com/topic/15849
Ajax4Jsf 的几个小例子
http://www.iteye.com/topic/58638
jsf实现翻页
http://fourfire.iteye.com/blog/124768
JSF中并没有提供判断标签
http://sech.iteye.com/blog/137731
jsf client validators介绍
http://blog.youkuaiyun.com/yarshray/archive/2007/10/31/1859629.aspx
首先,我们在用这个验证之前,我们要做一些准备工作 :
1.把clientvalidators-X.X.jar放到类路径下面.
2.把taglib声明添加到JSP页面中
<%@ taglib uri="http://sourceforge.net/projects/jsf-comp/clientvalidators" prefix="cv"%>
3.定义组件(按钮or表单)提交时触发的JS回调函数.例如:在表单的 onSubmit函数和按钮的onClick函数 等等....
Form onSubmit
<h:form id="form1">onSubmit="return validate();" />
Button onClick
<h:commandbutton id="btn1">onClick="return validate();" />
该步骤重要
4:定义servlet映射
该组件通过/faces/* 前缀来载入需要的资源,一个JS文件. 确定你在web.xml文件中定义了
<servlet-mapping>
<servlet-name>Faces Servlet</servlet-name>
<url-pattern>/faces/*</url-pattern>
</servlet-mapping>
</h:commandbutton></h:form> 详细介绍每一个验证组件的使用.
Required Field Validator
大家都不陌生的一个需求验证,要求输入内容
属性:
componentToValidate 要验证的组件id, 每个验证组件都有该属性,下面就不在介绍
errorMessage 要显示的错误消息 每个验证组件都有该属性,下面就不在介绍
highlight 是否高亮显示 true/false, 默认值为false.每个验证组件都有该属性,下面就不在介绍
display 验证错误的显示模式. 可能的值为 "static", "dynamic" (default), "none".下面会有进一步下说明. 每个验证组件都有该属性,下面就不在介绍
style 用于验证消息的CSS 每个验证组件都有该属性,下面就不在介绍
示例:
<cv:requiredfieldvalidator errormessage="Value is required" display="dynamic" highlight="true" componenttovalidate="txt1">
Range Validator 范围验证
minValue or maxValue 是必须的.
属性:
componentToValidate
minValue 输入的最小值
maxValue 输入的最大值
errorMessage
highlight
display
style
示例:
<cv:rangefieldvalidator highlight="true" maxvalue="20" minvalue="10" componenttovalidate="txt1">
Compare Validator 验证两个组件的输入值是否相等.验证两个密码的时候比较有用.
属性:
componentToValidate
componentToCompare 要比较值的另外一个组件id
operator 比较的操作, 可以为"eq" or "not". 相等或者不等.
errorMessage
highlight
display
style
示例:
<cv:comparevalidator errormessage="Value is invalid" op="not" componenttocompare="txt2" componenttovalidate="txt1">
Regular Expression Validator 正则表达式验证, 比较强大,可以验证email
属性:
componentToValidate
pattern 正则表达式模式. 参考java中的pattern类
errorMessage
highlight
display
style
示例:
<cv:regularexpressionvalidator highlight="true" pattern="/[abcd]/" componenttovalidate="txt1">
<cv:regularexpressionvalidator errormessage="请输入有效的电子邮件" highlight="true" pattern="/^([a-zA-Z0-9]+[_|\-|\.]?)*[a-zA-Z0-9]+@([a-zA-Z0-9]+[_|\-|\.]?)*[a-zA-Z0-9]+\.[a-zA-Z]{2,3}$/gi" componenttovalidate="emailAddress">
</cv:regularexpressionvalidator></cv:regularexpressionvalidator></cv:comparevalidator></cv:rangefieldvalidator></cv:requiredfieldvalidator> Length Validator Validator 长度验证
属性:
componentToValidate
exactly 如果指定该值,那么输入的长度一定要等于该值的长度
min 长度的最小值
max 长度的最大值
errorMessage
highlight
display
style
示例:
<cv:lengthvalidator errormessage="Value is invalid" display="dynamic" exactly="10" componenttovalidate="txt1">
Integer Only Validator 该验证没有实现为一个组件, 而是用一个js函数来代替. 该函数显示键入的字符并且值允许字符为整数, 调用的函数必须是
keyPressNumber(false); 在onkeypress事件上调用.
例子:
属性: 没有属性
<h:inputtext onkeypress="keyPressNumber(false);" value="#{pc_Index.person.ssn}" id="txt_ssn">
Custom Validator
自定义验证, 给你提供一个扩展的接口
属性:
componentToValidate
function
自定义验证函数
params
函数的参数
errorMessage
highlight
display
style
示例:
<cv:customvalidator params="'form1:txt_custom'" function="customFunctionName" componenttovalidate="txt_custom">
以下为代码:
</cv:customvalidator></h:inputtext></cv:lengthvalidator> function customFunctionName(param1) { var value = document.all[param1].value; if(value == 'someValueToBeTested') return true; else return false; }
Validation Summary 如果在页面上添加该标签,则显示该页面的所有验证的摘要信息
属性:
style
示例:
<cv:validationsummary>
Script Generator 主要的一个负责编码验证函数调用的组件
属性:
form
要验证的form 的id
popup 是否显示验证信息为popup, 默认值为false.
示例:
<cv:scriptgenerator popup="false">
</cv:scriptgenerator></cv:validationsummary> 国际化和错误消息问题
Client validators使用下面的顺序来查找错误消息
1) errorMessage 属性
首先应用该处的错误消息,可以使用值绑定表达式
2) Resource Bundle 如果在1中没有指定值,则使用这里包含在资源文件中的消息,
每个消息的key 在下面介绍
3) Built-in constant messages.
如果前面两步都没有错误消息,那么使用代码中硬编码的消息
关于display 属性的值
显示模型可以通过display属性来自定义. 下面是几种模型的解释:
dynamic
默认值,显示消息的空间(html标签)不是总是存在的,只有当错误消息出现时候才动态生成的.
static
显示消息的标签总是存在的.
none
不在组件后面显示错误消息, 只是在总结中显示总的错误消息
display 只是控制响应错误消息的div的 display css属性: 使用none时候,会产生下面的css 到该消息div上.style="DISPLAY: none"
资源绑定的消息的key
CV_REQUIRED_FIELD_VALIDATOR_ERROR = Some Text
CV_COMPARE_VALIDATOR_ERROR = Some Text
CV_RANGE_VALIDATOR_ERROR = Some Text
CV_REGULAR_EXPRESSION_VALIDATOR_ERROR = Some Text
CV_LENGTH_VALIDATOR_ERROR = Some Text
如果用过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">
</cv:scriptgenerator>
<h:outputtext id="outmsg" value="#{ValidatorForm.outmsg}">
</h:outputtext>
在这个例子中，cv作为前缀的标签，就是clientvalidators扩展框架提供的标签。<cv:requiredfieldvalidator>标签表示必须输入的验证，componentToValidate属性表示要</cv:requiredfieldvalidator></h:commandbutton></cv:requiredfieldvalidator></h:inputtext></h:form></f:view>
验证的输入组件的id，display表示要用那种形式的样式的
要验证，popup表示是否弹出验证错误消息对话框。
注：在richjsf中<a4j:commandbutton>标签也是使用客户端代码的，所以在onclick事件中要注意执行流程的控制。以下是我建议的一种验证事件写法：
<a4j:commandbutton value="Hello" onclick="if(!validate())return" action="#{ValidatorForm.evt_Save}" rerender="outmsg"></a4j:commandbutton></a4j:commandbutton>
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表示输入错误的提示信息</cv:customvalidator></cv:lengthvalidator></cv:regularexpressionvalidator></cv:comparevalidator></cv:rangevalidator></cv:requiredfieldvalidator>
扫一扫
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
