jquery-validform 表单验证插件 在实时验证输入值的 (因地制宜):
官网里的 Validform实现用户名的实时验证
<input name="userName" ajaxurl="user_register.action" datatype="s6-18" errormsg="用户名至少6个字符,最多18个字符!" type="text"/>
Struts2 中 user_register 动作类中 已有 模型 UserInfo 的 userName 来接收该输入值,所以得修改 传递参数格式:
public class UserAction extends ActionSupport
implements ModelDriven<UserInfoVO>,
SessionAware, AjaxAware{
private UserInfoVO userInfo = new UserInfoVO( );
@Override
public UserInfoVO getModel() {
return this.userInfo;
}
public String isExistSameUserName( ) {
if( userService.isExistSameUserName(userInfo.getUserName() ) ) {
// 查询数据库,发现账号已被注册
// 设置 操作返回类型
ajaxResponse.setValidformValid(false);
}else {
// 没有被注册,允许
ajaxResponse.setValidformValid(true);
}
return "isExistSameName";
}
/* 省略其他 业务逻辑代码 */
}
说明了 ajaxurl指定的文件可以接收到Post过来的两个值,分别是param和name,param是该元素的值,name是该元素的name名称。现在发现在后台 如果按照这种格式(即 param=inputValue&name=inputName) 来传递,那得在每个 Struts2 的 Action 类中添加这两个属性(param,name)来 接收这两个值。但是自个的模型却已有属性来接收(userName ),现在要求 把传递格式 该为 userName=张三,只有这样 UserInfo 模型才能接收到 输入框的值。
修改传递参数的:
(1)在jquery-validform源码中 找到 ajaxurl 的设置传递参数格式的 代码(寻找 验证检测单个表单元素 的方法):
check:function(curform,subpost,bool){
/*
检测单个表单元素;
验证通过返回true,否则返回false、实时验证返回值为ajax;
bool,传入true则只检测不显示提示信息;
*/
/* 省略源码中的 其他代码 */
var localconfig={
type: "POST",
cache:false,
url: ajaxurl,
/* 这里是 jquery 的 ajax 函数的 参数设置一样 data */
data: "param="+encodeURIComponent(inputval)+"&name="+encodeURIComponent($(this).attr("name")),
success: function(data){
if($.trim(data.status)==="y"){
inputobj[0].validform_valid="true";
data.info && inputobj.attr("sucmsg",data.info);
Validform.util.showmsg.call(curform,inputobj.attr("sucmsg") || curform.data("tipmsg").r||tipmsg.r,settings.tiptype,{obj:inputobj,type:2,sweep:settings.tipSweep},"bycheck");
_this.removeClass("Validform_error");
errorobj=null;
if(inputobj[0].validform_subpost=="postform"){
curform.trigger("submit");
}
}else{
inputobj[0].validform_valid=data.info;
Validform.util.showmsg.call(curform,data.info,settings.tiptype,{obj:inputobj,type:3,sweep:settings.tipSweep});
_this.addClass("Validform_error");
}
_this[0].validform_ajax=null;
},
}
现在找到了 在实时验证的模块 设置 参数传递格式 的代码
data: "param="+encodeURIComponent(inputval)+"&name="+encodeURIComponent($(this).attr("name")),
这句代码委托 jquery的 ajax 模块 POST 过来变量param和name 给 url ,所以 传递给 后台的参数为:param=张三&name=userName,但是这种传递格式 无法与modelDriven、params 这两个拦截器配合(尤其是 ModelDriiven 拦截器,因为 模型一般不会有 param 属性),所以动作类得另外 添加两个属性 param 和 name 属性(和配套的 get、set方法)来接收传递过来的参数
/*Strust2 下的 两个关于 请求参数处理的 两个拦截器
在 struts2-core.jar 包下的 struts-default.xml 中有声明
*/
<interceptor name="modelDriven" class="com.opensymphony.xwork2.interceptor.ModelDrivenInterceptor"/>
<interceptor name="params" class="com.opensymphony.xwork2.interceptor.ParametersInterceptor"/>
(2)为适应本业务,所以传递的 格式必须为 userName=张三,这样才能 更好地与 ModelDriven 和 params 结合,这样就可以直接把参数复制 模型的对应属性中。
所以把 格式参数改为(userName=张三),即把它替换为下面的语句:
data : encodeURIComponent($(this).attr("name")) + "=" +encodeURIComponent(inputval),
(3)这里的实时验证 是否通过的 判断逻辑为 status==='y' ,根据字符串来判断 语义上不是很清晰,改为 判断 status===true,在后台设置 status=true 即可。
if($.trim(data.status)==="y")
——》改为
if( data.status===true )
最后的最后,感谢 jquery-validform 插件创作团队的 无私奉献,这个插件的设计真的很优良。真诚感谢他们!!!!