Struts2(十六)Json
一、JSON
Json就是浏览器和服务器之间交换数据的一种轻量级对象
javaSctipt中类似的对象操作
$(function() {
var person = {
"name" : "张三",
"age" : 21,
"wife" : "李四"
};
$("#msg").append("姓名:" + person.name+"<br/>").append("年龄:" + person.age+"<br/>")
.append("老婆:" + person.wife+"<br/>");
})
二、一个小例子
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>json测试</title>
<script type="text/javascript" src="js/jquery-1.8.2.js"></script>
<script type="text/javascript" src="js/jsonDemo.js"></script>
<style type="text/css">
td {
border: 1px solid blue;
width:100px;
}
</style>
</head>
<body> <div id="msg"></div>
<div id="msg2"></div>
<div id="msg3"></div>
<input id="btn" type="button" value="JSON与字符串转换" /><br/>
<input id="btn2" type="button" value="字符串与JSON转换" />
</body>
</html>
$(function() {
// json对象
var person = {
"name" : "张三",
"age" : 21,
"wife" : "李四"
};
$("#msg").append("姓名:" + person.name + "<br/>").append("年龄:" + person.age
+ "<br/>").append("老婆:" + person.wife + "<br/>"); // 数组
var arr1 = ["广东", "广西", "湖南", "湖北", "江西"]
// 使用循环遍历
for (var i = 0; i < arr1.length; i++) {
$("#msg2").append(arr1[i] + " ");
} // 对象数组
var users = [{
"name" : "张三",
"pwd" : "123qwe",
"age" : 21
}, {
"name" : "李四",
"pwd" : "asdf",
"age" : 22
}, {
"name" : "王五",
"pwd" : "fsde",
"age" : 23
}, {
"name" : "赵六",
"pwd" : "zcxe",
"age" : 24
}]; $("#msg3").append("<table>");
for (var i = 0; i < users.length; i++) { $("#msg3").append("<tr>").append("<td>" + users[i].name + "</td>").append("<td>"
+ users[i].pwd + "</td>").append("<td>" + users[i].age
+ "</td>").append("</tr>");
}
$("#msg3").append("</table>"); // json和字符串转换
$("#btn").bind("click",function(){
alert(JSON.stringify(users))
alert(typeof JSON.stringify(users))
})
//将字符串转换为对象
var str='{"name":"张三丰","pwd":"qwer","age":123}' $("#btn2").bind("click",function(){
alert(JSON.parse(str).name);
//显示类型为string
alert(typeof JSON.parse(str).name)
alert(JSON.parse(str).pwd);
alert(typeof JSON.parse(str).pwd)
alert(JSON.parse(str).age);
//显示类型为number
alert(typeof JSON.parse(str).age)
}) })
三、服务器端设置和客户端使用Ajax请求
<param name="excludeProperties" >不包含的元素 </param>
<param name="includeProperties" >包含的元素 </param>
<param name="root">
person.job 字段或者对象
</param>
3.1、Ajax实现取重服务器端的数据
package com.pb.web.action; import com.opensymphony.xwork2.ActionSupport; public class DataAction extends ActionSupport { private String name;
private String pwd;
private Integer age; public String getData(){
name="张三丰";
pwd="太极宗师108";
age=108;
return SUCCESS;
} public String getName() {
return name;
} public void setName(String name) {
this.name = name;
} public String getPwd() {
return pwd;
} public void setPwd(String pwd) {
this.pwd = pwd;
} public Integer getAge() {
return age;
} public void setAge(Integer age) {
this.age = age;
} }
struts.xml
<?xml version="1.0" encoding="UTF-8" ?>
<!DOCTYPE struts PUBLIC
"-//Apache Software Foundation//DTD Struts Configuration 2.3//EN"
"http://struts.apache.org/dtds/struts-2.3.dtd"> <struts>
<constant name="struts.enable.DynamicMethodInvocation" value="false" />
<constant name="struts.devMode" value="true" /> <package name="default" namespace="/" extends="json-default">
<action name="getData" class="com.pb.web.action.DataAction" method="getData">
<result type="json">
<!--默认返回Action中全部数据 param可以指定下要传的元素 -->
<param name="includeProperties">
name,pwd,age
</param>
</result>
</action>
</package>
</struts>
javascript
$(function() { $("#btn").click(function() {
$.ajax({
url : "getData",
type : "post",
data : null,
dataType : "json",
success : function(data) {
$("#msg").html("");
$("#msg").append("姓名:" + data.name + "<br/>")
.append("密码:" + data.pwd + "<br/>")
.append("年龄:" + data.age + "<br/>")
},
error : function() {
$("#msg").html("");
$("#msg").html("获取数据失败");
}
});
});
});
页面
<input type="button" id="btn" value="Ajax获取Json" />
<div id="msg"></div>
四、返回对象和集合时
package com.pb.web.action; import java.util.ArrayList;
import java.util.List; import com.opensymphony.xwork2.ActionSupport;
import com.pb.entity.User; public class DataAction extends ActionSupport { private String name;
private String pwd;
private Integer age;
private User user;
private List<User> users; public String getData(){
name="张三丰";
pwd="太极宗师108";
age=108;
return SUCCESS;
}
public String getUserString(){
user=new User(1, "乔丹", "123", 40);
return SUCCESS;
} public String getUsersString(){
users=new ArrayList<User>();
users.add(new User(1, "乔丹", "123", 40));
users.add(new User(2, "科比", "123", 36));
users.add(new User(3, "C罗", "123", 25));
return SUCCESS;
} public String getName() {
return name;
} public void setName(String name) {
this.name = name;
} public String getPwd() {
return pwd;
} public void setPwd(String pwd) {
this.pwd = pwd;
} public Integer getAge() {
return age;
} public void setAge(Integer age) {
this.age = age;
} public User getUser() {
return user;
} public void setUser(User user) {
this.user = user;
}
public List<User> getUsers() {
return users;
}
public void setUsers(List<User> users) {
this.users = users;
} }
struts.xml
<?xml version="1.0" encoding="UTF-8" ?>
<!DOCTYPE struts PUBLIC
"-//Apache Software Foundation//DTD Struts Configuration 2.3//EN"
"http://struts.apache.org/dtds/struts-2.3.dtd"> <struts>
<constant name="struts.enable.DynamicMethodInvocation" value="false" />
<constant name="struts.devMode" value="true" /> <package name="default" namespace="/" extends="json-default">
<action name="getData" class="com.pb.web.action.DataAction" method="getData">
<result type="json">
默认返回Action中全部数据 param可以指定下要传的元素
<param name="includeProperties">
name,pwd,age
</param>
</result>
</action>
<action name="getUser" class="com.pb.web.action.DataAction" method="getUserString">
<result type="json">
<!-- 默认返回Action中全部数据 param可以指定下要传的元素
<param name="root"> ajax接收直接data.属性就可以
user
</param> -->
<param name="includeProperties">user.*</param>
<!-- 使用 对象.*时接收时ajax要用 date.user.属性才可以-->
</result>
</action>
<action name="getUsers" class="com.pb.web.action.DataAction" method="getUsersString">
<result type="json">
<!-- 默认返回Action中全部数据 param可以指定下要传的元素 -->
<!-- --><!-- ajax接收直接 data.length遍历时取值使用data[i].属性就可以 -->
<!-- <param name="root">
users
</param> -->
<param name="includeProperties">users.*</param>
<!-- 使用 对象.*时接收时ajax要用 date.users.length 取值时使用date.users[i].属性才可以 -->
</result>
</action>
</package>
</struts>
javascript
$(function() { $("#btn").click(function() {
$.ajax({
url : "getData",
type : "post",
data : null,
dataType : "json",
success : function(data) {
$("#msg").html("");
$("#msg").append("姓名:" + data.name + "<br/>")
.append("密码:" + data.pwd + "<br/>")
.append("年龄:" + data.age + "<br/>")
},
error : function() {
$("#msg").html("");
$("#msg").html("获取数据失败");
}
});
});
// 获取用户对象
$("#btn2").click(function() {
$.ajax({
url : "getUser",
type : "post",
data : null,
dataType : "json",
success : function(data) {
$("#msg2").html("");
$("#msg2").append("ID:" + data.user.id + "<br/>")
.append("姓名:" + data.user.username + "<br/>")
.append("密码:" + data.user.password + "<br/>")
.append("年龄:" + data.user.age + "<br/>")
},
error : function() {
$("#msg2").html("");
$("#msg2").html("获取数据失败");
}
});
});
// 获取对象集合
$("#btn3").click(function() {
$.ajax({
url : "getUsers",
type : "post",
data : null,
dataType : "json",
success : function(data) {
$("#msg3").html("");
$("#msg3").append("<tabel>");
for (var i = 0; i < data.users.length; i++) {
$("#msg3")
.append("<tr>")
.append("<td>" + data.users[i].id + "</td>")
.append("<td>" + data.users[i].username
+ "</td>")
.append("<td>" + data.users[i].password + "</td>")
.append("<td>" + data.users[i].age
+ "</td>").append("</tr>");
}
$("#msg3").append("<tabel>");
},
error : function() {
$("#msg3").html("");
$("#msg3").html("获取数据失败");
}
});
});
});
五、无刷新页页登录和注销
package com.pb.entity;
/*
* 用户实体类
*/
public class User { private String username;
private String password;
public String getUsername() {
return username;
}
public void setUsername(String username) {
this.username = username;
}
public String getPassword() {
return password;
}
public void setPassword(String password) {
this.password = password;
} }
package com.pb.web.action; import java.util.Map; import org.apache.struts2.interceptor.SessionAware; import com.opensymphony.xwork2.ActionSupport;
import com.pb.entity.User; public class UserAction extends ActionSupport implements SessionAware {
private User user;
private Map<String, Object> session;
private boolean flag; //登录的验证方法
public String login(){
if(user.getUsername().equals("accp")&&user.getPassword().equals("accp")){
//如果用户名和密码都正确,将这个用户放入Session中
session.put("u", user);
flag=true;
}else{
flag=false;
} return SUCCESS;
}
/*
* 退出
*/
public String logout(){
session.remove("user");
return SUCCESS;
} //实现sesssionAware接口的方法
@Override
public void setSession(Map<String, Object> session) {
this.session=session; } public User getUser() {
return user;
} public void setUser(User user) {
this.user = user;
}
public Map<String, Object> getSession() {
return session;
} public boolean isFlag() {
return flag;
} public void setFlag(boolean flag) {
this.flag = flag;
} }
struts.xml
<?xml version="1.0" encoding="UTF-8" ?>
<!DOCTYPE struts PUBLIC
"-//Apache Software Foundation//DTD Struts Configuration 2.3//EN"
"http://struts.apache.org/dtds/struts-2.3.dtd"> <struts>
<constant name="struts.enable.DynamicMethodInvocation" value="false" />
<constant name="struts.devMode" value="true" /> <package name="default" namespace="/" extends="json-default">
<action name="login" class="com.pb.web.action.UserAction" method="login">
<result type="json">
<param name="includeProperties">
flag,user.*
</param>
</result>
</action>
<action name="logout" class="com.pb.web.action.UserAction" method="logout">
<result type="json">
<param name="includeProperties">
null
</param>
</result>
</action>
</package>
</struts>
页面
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>登录页面</title>
<script type="text/javascript" src="js/jquery-1.8.2.js"></script>
<script type="text/javascript" src="js/loginDemo.js"></script>
</head>
<body>
<div id="loginDiv">
用户名:<input type="text" name="name" /><br/>
密码:<input type="password" name="password"/><br/>
<input type="button" value="登录" id="loginbtn" />
<span id="msg"></span>
</div>
</body>
</html>
js
/**
* 登录页面js
*/
$(function() {
$("#loginbtn").click(function() {
var params = {
"user.username" : $("input[name='name']").val(),
"user.password" : $("input[name='password']").val()
}
$.ajax({
url : "login.action",
type : "post",
data : params,
dataType : "json",
success : function(data) {
// alert(data.flag);
if (data.flag == true) {
$("#loginDiv")
.html("")
.append("欢迎您!")
.append(data.user.username)
.append("<input id='logoutbtn' type='button' value='注销' />")
} else {
$("#msg").html("")
$("#msg").append("用户名或者密码错误 !").css(
"color", "#FF0000")
} },
error : function() {
$("#msg").html("")
$("#msg").append("登录异常!").css("color",
"#FF0000");
}
});
});
$("#logoutbtn").live("click",function(){
$.ajax({
url:"logout",
type:"post",
dataType:"json",
success:function(data){
//alert(JSON.stringify(data));
$("#loginDiv").html("");
$("#loginDiv").append('用户名:<input type="text" id="username" value="">密码:<input type="password" id="password" value=""><input type="button" value="登录" id="btn"><span id="msg"></span>');
},
error:function(){
alert("ajax请求失败");
} });
});
});
Struts2(十六)Json的更多相关文章
- 二十六:Struts2 和 spring整合
二十六:Struts2 和 spring整合 将项目名称为day29_02_struts2Spring下的scr目录下的Struts.xml文件拷贝到新项目的scr目录下 在新项目的WebRoot-- ...
- python3.4学习笔记(二十六) Python 输出json到文件,让json.dumps输出中文 实例代码
python3.4学习笔记(二十六) Python 输出json到文件,让json.dumps输出中文 实例代码 python的json.dumps方法默认会输出成这种格式"\u535a\u ...
- Struts2(十六篇)
(一)Struts2框架概述 (二)Struts2配置文件 (三)Struts2的Action(简单讲解版) (四)Struts2的Action(深入讲解版) (五)Struts2处理结果管理 (六) ...
- Python之路【第十六篇】:Django【基础篇】
Python之路[第十六篇]:Django[基础篇] Python的WEB框架有Django.Tornado.Flask 等多种,Django相较与其他WEB框架其优势为:大而全,框架本身集成了O ...
- 十六款值得关注的NoSQL与NewSQL数据库--转载
原文地址:http://tech.it168.com/a2014/0929/1670/000001670840_all.shtml [IT168 评论]传统关系型数据库在诞生之时并未考虑到如今如火如荼 ...
- 手机自动化测试:appium源码分析之bootstrap十六
手机自动化测试:appium源码分析之bootstrap十六 poptest是国内唯一一家培养测试开发工程师的培训机构,以学员能胜任自动化测试,性能测试,测试工具开发等工作为目标.如果对课程感兴趣 ...
- Nodejs学习笔记(十六)--- Pomelo介绍&入门
目录 前言&介绍 安装Pomelo 创建项目并启动 创建项目 项目结构说明 启动 测试连接 聊天服务器 新建gate和chat服务器 配置master.json 配置servers.json ...
- J2EE进阶(十六)Hibernate 中getHibernateTemplate()方法使用
J2EE进阶(十六)Hibernate 中getHibernateTemplate()方法使用 spring 中获得由spring所配置的hibernate的操作对象,然后利用此对象进行,保存,修 ...
- m_Orchestrate learning system---三十六、如何修改插件的样式(比如ueditor)
m_Orchestrate learning system---三十六.如何修改插件的样式(比如ueditor) 一.总结 一句话总结:所有的js,html插件,修改样式无非是两种,一是直接修改css ...
随机推荐
- 【Android菜鸟学习之路】环境搭建问题-修改AVD Path
更改avd默认路径
- Screensiz.es – 最流行移动设备及显示器的屏幕规格大全
Screensiz.es 帮助您快速找到目前市场上最流行的设备和显示器的屏幕规格.尺寸数据来自维基百科,使用更好理解的像素密度.流行度推算自 Google 查询(从 AdWords 流量估算),以及一 ...
- 内存中OLTP(Hekaton)里的事务日志记录
在今天的文章里,我想详细讨论下内存中OLTP里的事务日志如何写入事务日志.我们都知道,对于你的内存优化表(Memory Optimized Tables),内存中OLTP提供你2个持久性(durabi ...
- Linux内核知识
版本 linus树 Linux内核最初创始人--Linus Torvalds管理一个Linus树,linus树也称为主线(mainline).一般指的upstream,"上游",也 ...
- HT图形组件设计之道(四)
在<HT图形组件设计之道(二)>我们展示了HT在2D图形矢量的数据绑定功能,这种机制不仅可用于2D图形,HT的通用组件甚至3D引擎都具备这种数据绑定机制,此篇我们将构建一个3D飞机模型,展 ...
- 3D拓扑自动布局之Web Workers篇
2D拓扑的应用在电信网管和电力SCADA领域早已习以为常了,随着OpenGL特别是WebGL技术的普及,3D方式的数据可视化也慢慢从佛殿神堂步入了寻常百姓家,似乎和最近高档会所被整改为普通茶馆是一样的 ...
- 订餐APP第一次sprint+燃尽图
MY-HR 成员: 角色分配 学号 博客园 团队贡献分 丘惠敏 PM项目经理 201406114203 http://www.cnblogs.com/qiuhuimin/ 19 郭明茵 用户 2014 ...
- 数论 - 算数基本定理的运用 --- nefu 118 : n!后面有多少个0
题目链接:http://acm.nefu.edu.cn/JudgeOnline/problemshow.php Mean: 略. analyse: 刚开始想了半天都没想出来,数据这么大,难道是有什么 ...
- [转]easyui datagrid 批量编辑和提交
web前台主要代码: <script type="text/javascript"> $(function() { var $dg = $("#dg" ...
- 在aspx怎么引用public string getPicurl(string picurl)?
刚才在论坛上看到一帖: Insus.NET尝试做了一下,直接使用一个Img标签是无法实现.因为函数中返回的即是一个img html标签,因此在aspx页再不能使用Img了. 现在可以回到网友的问题,那 ...