现在的位置: 首页 > 综合 > 正文

web页面js校验某一属性是否重复的探索

2018年02月11日 ⁄ 综合 ⁄ 共 1718字 ⁄ 字号 评论关闭

     近期项目中遇到web某一页面,使用表格设置多行信息,每行属性柜子号码不可重复校验,由于重复校验很头疼,不能使用一般的js正则表达式匹配解决问题额,完全的依靠前台遍历性能很烂,一直困扰额。。。

    由于信息设置使用的是form表单提交,控制器采用spring MVC框架,可以自动帮忙封装bean的map对应属性,于是乎,

$('#scForm').form('submit', {  
       
url:'xxx.action?totalNum='+totalNum.length,                     //totalNum
是表格中行数
        onSubmit:function(){
        var flag = true;
         $.ajax({
          type:'POST',
          url:'xxx2.action?totalNum='+totalNum.length,
          data:$("#scForm").serialize(),//校验时候传过去form中的值,name到后台对应封装map的key    由于key相同属性会覆盖,所以一旦重复了 map的值覆盖会出现map的size与totalNum不一致的情况,可知属性重复了,这样可以避免繁琐的性能很烂的遍历!
          async:false,//提交之前做的事情
          success:function(data){
           data = $.parseJSON(data);
                 if(data.result=="repeat"){
                    flag = false;
                    $.messager.alert('提示', data.errormsg, 'error');
                 }
          }
         });
        if(flag){
         $("#scTable select[name$='.status']").removeAttr("disabled");
        } 
        return flag;
        },
        success:function(data){
         data = $.parseJSON(data);
         if (data.result == "success"){
          $.messager.alert('提示', '保存成功!', 'info', function () {
           window.parent.$('#lockerDetailWindow').window('close');
           window.parent.$('#lockertable').datagrid('load');
       }); 
         }else{
          $.messager.alert('提示', 保存失败!错误信息:'+data.errormsg, 'error');
         }
        }
   });

当然还遗漏了一点就是:为属性添加change事件,一旦改变则将其name属性改变,才可保证使后台map封装时候相同的key覆盖,

$(".pros").change(function(){
  var vals = $(this).val();
  $(this).attr("name","preMap['key"+vals+"'].no");
  var valsTr = $(this).parents("tr");
  $(valsTr.find($("select"))[0]).attr("name","preMap['key"+ vals+ "'].code");
  $(valsTr.find($("select"))[1]).attr("name","preMap['key"+ vals+ "'].status");
 });

 

至此,可以巧妙地解决重复校验的问题。。

抱歉!评论已关闭.