struts2.3.16 ajax json,Struts2实现JSON和Ajax操作(十四)

勿以恶小而为之，勿以善小而不为--------------------------刘备

劝诸君，多行善事积福报，莫作恶

上一章简单介绍了Struts2使用Token避免表单重复提交(十三),如果没有看过，请观看上一章

在网页前后端分离操作的过程中，通过JSON数据进行前后端的传输，利用Ajax进行异步的提交。其重要性就不说了。

一. Struts2 整合 Ajax

一.一 添加整合的Json依赖(Jar包)

将这些Jar包从Struts中找到，然后放置到WEB-INF下的lib包下，添加到path中。

特别不要忘记用struts2-json-plugin-2.3.30.jar包。

以下是关于Struts2比较全的Jar包

一.二 新建UserAction类

package com.yjl.web.action;

import java.util.ArrayList;

import java.util.List;

import org.apache.log4j.Logger;

import com.opensymphony.xwork2.ActionSupport;

import com.opensymphony.xwork2.ModelDriven;

import com.yjl.pojo.User;

import net.sf.json.JSONArray;

import net.sf.json.JSONObject;

/**

* @author 两个蝴蝶飞

* @version 创建时间：2018年9月14日 下午6:35:10

* 演示json交互的Action

*/

public class UserAction extends ActionSupport implements ModelDriven{

private static final long serialVersionUID = -4164832837385401186L;

private static Logger logger=Logger.getLogger(UserAction.class);

private User user=new User();

//定义结果,为字符串类型,这个非常重要

private String result;

public String getResult() {

return result;

}

public void setResult(String result) {

this.result = result;

}

public User getModel(){

return user;

}

public String register(){

return SUCCESS;

}

/**

* 返回一个字符串

*/

public String register1(){

logger.info("注册时的名称为:"+user.getName());

//只是简单的验证，判断一下是否是两个蝴蝶飞

if("两个蝴蝶飞".equals(user.getName())){

result="true";

}else{

result="false";

}

//得到的是一个字符串

logger.info("结果为:"+result);

return "register1";

}

/**

* 返回一个对象字符串

*/

public String register2(){

//得到的是一个字符串

User user=new User();

user.setName("两个蝴蝶飞");

user.setId(1);

user.setSex("男");

//将其转换成Json 字符串

JSONObject object=JSONObject.fromObject(user);

result=object.toString();

logger.info("结果为:"+result);

return "register2";

}

/**

*

* 返回的是一个 List 集合数组

*/

public String register3(){

List allList=new ArrayList();

//得到的是一个字符串

User user=new User();

user.setName("两个蝴蝶飞");

user.setId(1);

user.setSex("男");

allList.add(user);

User user2=new User();

user2.setName("老蝴蝶");

user2.setId(2);

user2.setSex("男");

allList.add(user2);

//将其转换成Json 字符串

JSONArray object=JSONArray.fromObject(allList);

result=object.toString();

logger.info("结果为:"+result);

return "register3";

}

}

一.三 配置struts.xml文件

/WEB-INF/content/success.jsp

result

/WEB-INF/content/{1}.jsp

创建两个包，分开写， 一个处理普通的方法，一个处理ajax 方法。

一.四 编写 /content/register.jsp 页面

这是一个注册框架的页面

一.五 在register.jsp 页面添加脚本

$(function() {

$("#name").blur(function() {

var value = $(this).val();

//字符串

ajaxString(value);

//单个对象

ajaxBean(value);

//对象数据

ajaxList(value);

})

});

function ajaxString(value) {

$.ajax({

url : "/Struts_Ajax/UserAjax_register1.action",

type : "post",

data : {

"name" : value

},

dataType : "json",

async : false,

success : function(result) {

//alert(typeof(result)); ==>String

//1.用JSON去转换这个字符串为json对象

var obj = JSON.parse(result);

console.log(obj);

if (obj) {

console.log("已经存在");

} else {

console.log("未注册");

}

}

});

}

function ajaxBean(value) {

$.ajax({

url : "/Struts_Ajax/UserAjax_register2.action",

type : "post",

data : {

"name" : value

},

dataType : "json",

async : false,

success : function(result) {

//alert(typeof(result)); ==>String

//1.用JSON去转换这个字符串为json对象

var obj = JSON.parse(result);

console.log(obj);

console.log("姓名是:" + obj.name);

}

});

}

function ajaxList(value) {

$.ajax({

url : "/Struts_Ajax/UserAjax_register3.action",

type : "post",

data : {

"name" : value

},

dataType : "json",

async : false,

success : function(result) {

//alert(typeof(result)); ==>String

//1.用JSON去转换这个字符串为json对象

var obj = JSON.parse(result);

console.log(obj);

$.each(obj, function(idx, item) {

console.log("姓名是:" + item.name);

})

}

});

}

一.六 重启服务器，进行验证

当输入 两个蝴蝶飞，与后端的名称相同，鼠标离开焦点后

当输入 岳泽霖时，与后端的名称不相同，鼠标离开焦点后

关于JSON的知识，可以参考老蝴蝶以前写的文章: JSON简介及前端简单解析(一)

本章代码链接为

链接：https://pan.baidu.com/s/19gvj_htyq7nUd7M2I-e8Fg

提取码：l5ve

谢谢您的观看!!!