1.controller将数据封装成json格式返回页面
@RequestMapping("/dataList")
public void datalist(CsoftCunstomerPage page,HttpServletResponse response) throws Exception{
List<CsoftCunstomer> dataList = csoftCunstomerService.queryByList(page);
//设置页面数据
Map<String,Object> jsonMap = new HashMap<String,Object>();
jsonMap.put("total",page.getPager().getRowCount());
jsonMap.put("rows", dataList);
try {
//设置页面不缓存
response.setContentType("application/json");
response.setHeader("Pragma", "No-cache");
response.setHeader("Cache-Control", "no-cache");
response.setCharacterEncoding("UTF-8");
PrintWriter out= null;
out = response.getWriter();
out.print(JSONUtil.toJSONString(jsonMap));
out.flush();
out.close();
} catch (IOException e) {
e.printStackTrace();
}
}
2.ajax提交数据以json格式到controller中
例一:
<!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" />
<!--<script type="text/javascript" src="../static/js/jquery-1.7.2.min.js"></script>-->
<!--JS的地址可以写成下面这样，将来部署的时候，这些静态文件就可以单独部署了，不依赖于后台路径-->
<script type="text/javascript" src="http://localhost:8080/sshdemo/static/js/jquery-1.7.2.min.js"></script>
<script type="text/javascript">
$(document).ready(function() {
ajaxRequest();
}); function ajaxRequest() {
$.ajax({
url: "http://localhost:8080/sshdemo/hello/ajax",
type: "POST",
dataType: "json",
data: {
"a": ,
"b": ,
"c":
},
async: false,
success: function(data) {
alert("success");
$.each(data, function(index, element) {
alert(element.a);
alert(element.b);
alert(element.c);
});
},
error: function() {
alert("error");
}
});
}
</script>
</head>
<body>
<div>Hello World!</div>
</body>
</html>
实例二
package com.xbs.ready.ssh.controller; import com.alibaba.fastjson.JSON;
import java.io.IOException;
import java.io.PrintWriter;
import java.util.ArrayList;
import java.util.HashMap;
import java.util.List;
import java.util.Map;
import java.util.logging.Level;
import java.util.logging.Logger;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import org.springframework.stereotype.Controller;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.RequestMethod; /**
*
* @author xbs
*/
@Controller
@RequestMapping("hello")
public class HelloController { /**
* ajax请求不需要返回页面，只需要得到response中的数据即可，所以方法签名为void即可
*
* @param request
* @param response
*/
@RequestMapping(value = "ajax", method = RequestMethod.POST)
public void ajaxDatas(HttpServletRequest request, HttpServletResponse response) {
String jsonResult = getJSONString(request);
renderData(response, jsonResult);
} private String getJSONString(HttpServletRequest request) {
//故意构造一个数组，使返回的数据为json数组，数据更复杂些
List<Map<String, Object>> datas = new ArrayList<Map<String, Object>>();
Map<String, Object> map1 = new HashMap<String, Object>();
//可以获得ajax请求中的参数
map1.put("a", request.getParameter("a"));
map1.put("b", request.getParameter("b"));
map1.put("c", request.getParameter("c"));
datas.add(map1);
//故意构造一个数组，使返回的数据为json数组，数据更复杂些
Map<String, Object> map2 = new HashMap<String, Object>();
map2.put("a", "");
map2.put("b", "");
map2.put("c", "");
datas.add(map2);
String jsonResult = JSON.toJSONString(datas);
return jsonResult;
} /**
* 通过PrintWriter将响应数据写入response，ajax可以接受到这个数据
*
* @param response
* @param data
*/
private void renderData(HttpServletResponse response, String data) {
PrintWriter printWriter = null;
try {
printWriter = response.getWriter();
printWriter.print(data);
} catch (IOException ex) {
Logger.getLogger(HelloController.class.getName()).log(Level.SEVERE, null, ex);
} finally {
if (null != printWriter) {
printWriter.flush();
printWriter.close();
}
}
}
}
例二:
<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<html>
<head>
<title>helloworld</title>
<script type="text/javascript" src="/spring_mvc/js/jquery.js"></script>
<script type="text/javascript">
$(function(){
$("#testButton").click(function(){
var $a = $(this);
$.ajax({
url:"/spring_mvc/testAjax.do",
type:'post',
data:'name=admin&password=123456',
dataType:'html',
success:function(data,status){
if(status == "success"){
var objs = jQuery.parseJSON(data);
var str = "";
for(var i=;i<objs.length;i++){
str = str + objs[i].activityName+" ";
}
$("#content").html(str);
}
},
error:function(xhr,textStatus,errorThrown){
}
});
});
});
</script>
</head>
<body>
<button id="testButton">异步传输</button>
<div id="content"></div>
</body>
</html>
例三:
@RequestMapping("/dataList")
public void datalist(CsoftCunstomerPage page,HttpServletResponse response) throws Exception{
List<CsoftCunstomer> dataList = csoftCunstomerService.queryByList(page);
//设置页面数据
Map<String,Object> jsonMap = new HashMap<String,Object>();
jsonMap.put("total",page.getPager().getRowCount());
jsonMap.put("rows", dataList);
try {
//设置页面不缓存
response.setContentType("application/json");
response.setHeader("Pragma", "No-cache");
response.setHeader("Cache-Control", "no-cache");
response.setCharacterEncoding("UTF-8");
PrintWriter out= null;
out = response.getWriter();
out.print(JSONUtil.toJSONString(jsonMap));
out.flush();
out.close();
} catch (IOException e) {
e.printStackTrace();
}
}