json_ajax交互

来源：互联网发布：dota牛蛙淘宝店编辑：程序博客网时间：2024/06/05 15:05

package ajax_json;

import java.io.IOException;
import java.util.ArrayList;
import java.util.List;

import javax.servlet.ServletException;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;

import com.google.gson.Gson;

public class Ajax_Json extends HttpServlet{

@Override
protected void doGet(HttpServletRequest req, HttpServletResponse resp)
throws ServletException, IOException {
this.doPost(req, resp);
}

@Override
protected void doPost(HttpServletRequest req, HttpServletResponse resp)
throws ServletException, IOException {
List<User> list=new ArrayList<User>();
User u1=new User();
u1.setId(1);
u1.setName("limao1");
User u2=new User();
u2.setId(2);
u2.setName("liyanping");
list.add(u1);
list.add(u2);
Gson gson=new Gson();
String str=gson.toJson(list);
System.out.println(req.getParameter("id"));
System.out.println(gson.toJson(list.get(0)));
System.out.println(str);
resp.getWriter().print(str);
resp.getWriter().flush();
}

}

<%@ 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>Insert title here</title>
<script type="text/javascript" src="jquery-1.9.1.js"></script>
<script type="text/javascript">
$(function() {
//alert();
$("#id").click(function() {
/**
return jQuery.ajax({
type: "GET",
url: url,
data: data,
success: callback,
dataType: type
});
*/
$.ajax({
type:"POST",
url:"ajax_json",
data:{"id":$("#id").val()},
dataType:"json",
success:function(data){
var list=data;
var html="<table>";
for(var i=0;i<list.length;i++){
var user=list[i];
html=html+"<tr><td>"+user.id+"</td><td>"+user.name+"</td></tr>";
}
html=html+"</table>";
//防止再次点击时，事件会继续发展
$("body table:eq(0)").remove();
$("body").append(html);
}
});
});
});
</script>
</head>
<body>
<input type="button" value="查询所有的person" id="id">
<div id="div"></div>
</body>
</html>

0 0