jQuery validationEngine 使用

简单记录一下jQuery ValidationEngine的使用

首先引入需要的文件

<link href="${basePath}/assets/plugins/validation/validationEngine.jquery.css" rel="stylesheet" type="text/css"/>
<script src="${basePath}/assets/plugins/validation/jquery.validationEngine-zh_CN.js" type="text/javascript"></script>
<script src="${basePath}/assets/plugins/validation/jquery.validationEngine.js" type="text/javascript"></script>

然后编写form表达,并给form表单ID

<form id="addUserForm" action="${basePath}/user/addUser" method="post">
<div class="col-md-3">
<input type="text" placeholder="" name="user.name" class="form-control validate[required]" value="${editUser.name}">
</div>
<label class="col-md-2 control-label">邮箱:
<span class="required">
 *
</span>
</label>
<div class="col-md-5">
<input type="text" placeholder="" name="user.email" class="form-control validate[required,custom[email],ajax[isEmailExist]]" value="${editUser.email}">
</div>
 </form>

然后进行初始化

$("#addUserForm").validationEngine('attach', { 
  promptPosition: 'bottomLeft', 
  scroll: true,
  //下面这部分是使用ajax方式进行form表单的提交
  ajaxFormValidation: true,
  ajaxFormValidationMethod: 'post',
  onAjaxFormComplete: function(status, form, json, options){
 if(status === true && json == '1'){
 $("#addUserPageCloseBtn").click();
 setDateToDiv('user/getUserList',null,null,null);
 }else{
 alert("出现问题!请检查数据");
 }
  }
});

使用方法就是在输入域的class 加上validate[requried,custom[email],ajax[isEmailExist]]等

自定义方法需要在

jquery.validationEngine-zh_CN.js

中添加,如果有国际化需求,还需要在对应的英文js文件中添加方法

暂时发现个小问题: 用ajax方式提交验证后的表单,返回结果必须是数字,才能进回调方法..好无奈啊..求指点