步骤
1、导入json验证包
json-lib-2.1-jdk15.jar
struts2-json-plugin-2.2.3.jar
2、配置action配置文件
注意:
(1)、package一定要继承至json-default
(2)、result的返回类型一定要是type="json"格式的数据
<packagename="ajaxValidate" namespace="/ajaxValidate"extends="json-default">
<actionname="ajaxValidate_*" class="userValidateAction"method="{1}">
<resultname="success" type="json"></result>
</action>
</package>
3、编写action处理类
注意:
(1)、返回的数据类型一定要添加上@JSON注解,这样struts拦截器才能够将返回的数据类型转换为JSON格式的数据
(2)、@JSON(serialize = false)声明该数据类型不需要转换为json格式
(3)、JSON格式的数据是根据strutsAction文件中getter方法确定的。例如action方法中有getMessage方法,那么返回的数据类型中就有message数据,调用方式为data.message
@Controller
@Scope("prototype")
publicclass UserValidateAction extends ActionSupport {
privatestatic final long serialVersionUID = 1L;
@Resource
privateUserService userService;
privateString username;
privateString message;
//用户重名验证
publicString userNameValidate() {
Useruser = userService.findByName(username);
if(user == null) {
message= "用户名可以使用!";
}else {
message= "用户名已经被注册,请使用其他用户名!";
}
returnSUCCESS;
}
@JSON(serialize= false)
//声明username不需要转化为json格式
publicString getUsername() {
returnusername;
}
publicvoid setUsername(String username) {
this.username= username;
}
@JSON
//@Json struts将将返回的数据类型转换为json格式
publicString getMessage() {
returnmessage;
}
publicvoid setMessage(String message) {
this.message= message;
}
}
4、编写前台验证js信息
验证js
//用户用验证
$().ready(function(){
//js得到项目的全路径
functiongetRootPath()
{
varpathName = window.location.pathname.substring(1);
varwebName = pathName == '' ? '' : pathName.substring(0, pathName.indexOf('/'));
returnwindow.location.protocol + '//' + window.location.host + '/'+ webName + '/';
}
$("input[name='user.name']").blur(function(){
varusername = $("input[name='user.name']").val();
//用户名不为空
if(username.trim()){
//json格式的数据
varparameter = {
username:username
};
//$.post(url,parameter,data)参数的意思是:url为请求的url地址。parameter为JSON格式的参数,data为回调函数
$.post(getRootPath()+"/ajaxValidate/ajaxValidate_userNameValidate.action",parameter,function(data){
$("#vldUserName").html(data.message);
});
}else{
$("#vldUserName").html("用户名是必须的!");
}
});
});
5、前台页面信息
<tr>
<td>登录名</td>
<td><inputtype="text" name="user.name"class="InputStyle"/> *
<span>
</td>
</tr>