本人搜索了Jquery engine ajax用法，基本上都是前篇一律的文章，而且很多都是不尽人意的，所以特来 写了一篇。
特别提示：使用的Jquery Engine版本是2.6.2
1、前台页面
html表单如下
<form action="" id="formId">
<input type="text" name="code" id="code" placeholder="验证码" class="validate[required,ajax[ajaxUserBaseCall]]">
</form>
引入的js库、css如下
<link rel="stylesheet" href="/css/validationEngine.css">
<script src="/js/jquery-1.8.2.min.js"></script>
<script src="/js/jquery.validationEngine-zh_CN.js" type="text/javascript"></script>
<script type="text/javascript" src="js/jquery.validationEngine.js"></script>
页面js如下
$('#formId').validationEngine({
promptPosition: 'centerRight',
});
$('#formId').submit(function () {
$(this).validationEngine('validate');
});
2、js文件
jquery.validationEngine-zh_CN.js文件如下
"ajaxUserBaseCall": {
"url": "/login/isRightIndentifyingCode",
// you may want to pass extra data on the ajax call
// "extraDataDynamic" : ['#code'],
"alertText": "* 此名称已被其他人使用",
"alertTextOk": "* 此帐号名称可以使用",
"alertTextLoad": "* 正在确认名称是否有其他人使用，请稍等。"
},
3、服务器端处理
页面调用指定的url验证地址，传递两个参数，名称为：fieldId,fieldValue，对应的值为元素的ID和VALUE，这两个参数是默认传递的，服务器端根据这两个参数实现判断逻辑，然后返回包含三个元素的数组：元素ID、检查是否通过(true or false)、提示信息。注意，字符串需要使用双引号引起来。
java后台代码如下
@ResponseBody
@RequestMapping("isRightIndentifyingCode")
public Object isright(String fieldId, String fieldValue, HttpServletRequest request){
JSONArray jsonArray = new JSONArray();
boolean flag = false;
System.out.println(fieldId);
System.out.println(fieldValue);
String indentifyingCode = indentifyingCodeServiceI.getIndentifyingCode(1);
if (fieldValue.equals(indentifyingCode)) {
flag = true;
}
jsonArray.put(fieldId);
jsonArray.put(flag);
return jsonArray;
}
1、这里值得注意的是,如果想要传递其它参数，使用的形式如下， "extraDataDynamic" : ['#email'],
其中email表示的是标签的id，表示传递的其它参数.
"ajaxUserBaseCall": {
"url": "/login/isRightIndentifyingCode",
// you may want to pass extra data on the ajax call
"extraDataDynamic" : ['#email'],
"alertText": "* 此名称已被其他人使用",
"alertTextOk": "* 此帐号名称可以使用",
"alertTextLoad": "* 正在确认名称是否有其他人使用，请稍等。"
},
2、注意传递回去的是json数据。
我引入的jar包是：org.json.jar
gradle 依赖如下
// https://mvnrepository.com/artifact/org.json/json
compile group: 'org.json', name: 'json', version: '20160807'
maven依赖如下：
<!-- https://mvnrepository.com/artifact/org.json/json -->
<dependency>
<groupId>org.json</groupId>
<artifactId>json</artifactId>
<version>20160807</version>
</dependency>
参考地址：
http://blog.csdn.net/jijunwu/article/details/19576345
http://code.ciaoca.com/jquery/validation-engine/
