AJAX
前端
可以通过JQuery的ajax方法请求到后端$.ajax
<script>
$(function() {
$.ajax({
url:'ajaxEmps',//传给后端@RequestMapping("/ajaxEmps")
data:"name=yang",//参数可以有多种写法
datatype:'json',//返回格式
success:function(data){
emp = emp=eval("("+data+")");//将JSON格式的字符串转成JSON
$.each(emp, function(i, result) {
console.log(result);
console.log(result.id);
item = "<tr><td>" + result.id + "</td><td>" + result.lastName + "</td></tr>";
$('#AjaxTable').append(item); //将遍历的数据插进table表格里
});
}
})
});
</script>
后端
private static Map<Integer, Employee> employees = null;//数据存放进这个变量中
@RequestMapping("/ajaxEmps")
protected void doGet(HttpServletRequest req, HttpServletResponse resp)
throws ServletException, IOException {
resp.setContentType("text/html;charset=utf-8");
PrintWriter out = resp.getWriter();
out.print(employees.values());//将数据传到前端
out.flush();
out.close();
}
ModelAndView
前端
<script>
$(function() {
var emp = "${requestScope.emp}";//后端将数据放进了Model,然后前端从中获取数据
emp=eval("("+emp+")");
$.each(emp, function(i, result) {
item = "<tr><td>" + result.id + "</td><td>" + result.lastName + "</td></tr>";
$('#requestScopeTable').append(item); //将遍历的数据插进table表格里
});
</script>
后端
private static Map<Integer, Employee> employees = null;//数据存放进这个变量中
@RequestMapping("/emps")
public String list(Map<String,Object> map){
map.put("emp",employees.values());
return "list";
}
数据
employees.toString()里是将所有变量拼接成JSON的格式
public String toString() {
return "{'id':'" + id + "', 'lastName':'" + lastName + "'}";
}
疑问
PS:数据在后端明明是Collection类型的,为什么传到前端就能,为什么传到前端就能变成JSON的字符串呢。
[{'id':'1001', 'lastName':'E-AA'},{'id':'1004', 'lastName':'E-DD'}]
JSON结构参考了:
http://www.json.org/json-zh.html
版权声明:本文为u011331067原创文章,遵循 CC 4.0 BY-SA 版权协议,转载请附上原文出处链接和本声明。