jquery-validform 与 Struts2 整合 实时验证,重设传递参数格式

 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过来的两个值,分别是paramnameparam是该元素的值,name是该元素的name名称。现在发现在后台 如果按照这种格式(即 param=inputValue&name=inputName) 来传递,那得在每个 Struts2 的 Action 类中添加这两个属性(paramname)来 接收这两个值。但是自个的模型却已有属性来接收(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 过来变量paramname 给 url ,所以 传递给 后台的参数为:param=张三&name=userName但是这种传递格式 无法与modelDrivenparams 这两个拦截器配合(尤其是 ModelDriiven 拦截器,因为 模型一般不会有 param 属性),所以动作类得另外 添加两个属性 param 和 name 属性(和配套的 getset方法)来接收传递过来的参数

/*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 插件创作团队的 无私奉献,这个插件的设计真的很优良。真诚感谢他们!!!!


评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值