天天看点

SpringMVC中利用json从后台穿数据到前台

利用json从后台传到前台userManager名称的页面中的过程。

[java]  view plain copy

SpringMVC中利用json从后台穿数据到前台
SpringMVC中利用json从后台穿数据到前台
  1. @RequestMapping(value="/addUserJson")  
  2.     public String addUserJson(User user,HttpServletRequest request,HttpServletResponse response){  
  3.         String result = "{\"userName\":\""+ user.getUserName() +"\",\"age\":\" "+ user.getAge()+" \"}";  
  4.         PrintWriter out = null;  
  5.         response.setContentType("application/json");  
  6.         try {  
  7.             out = response.getWriter();  
  8.             out.write(result);  
  9.         } catch (IOException e) {  
  10.             e.printStackTrace();  
  11.         }  
  12.         return "userManager";  
  13.     }  

前台接收部分

[html]  view plain copy

SpringMVC中利用json从后台穿数据到前台
SpringMVC中利用json从后台穿数据到前台
  1. <%@ page language="java" contentType="text/html; charset=UTF-8"  
  2.     pageEncoding="UTF-8"%>  
  3. <%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>  
  4. <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">  
  5. <html>  
  6. <head>  
  7. <script type="text/javascript" src="/springMVC6/js/jquery-1.7.1.min.js"></script>  
  8. <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">  
  9. <title>Insert title here</title>  
  10. <script type="text/javascript">  
  11.     $(document).ready(function(){  
  12.         $("#add").click(function(){  
  13.             var userName = $("#userName").attr("value");  
  14.             var age =$("#age").attr("value");  
  15.             var user = {userName:userName,age:age};  
  16.             $.ajax({  
  17.                 url:"/springMVC6/user/data/addUserJson",  
  18.                 type:"post",  
  19.                 data:user,  
  20.                 success:function(data){  
  21.                     alert("userName--->" + a.userName + "age--->" + a.age );  
  22.                 }  
  23.             });  
  24.         });  
  25.     });  
  26. </script>  
  27. </head>  
  28. <body>  
  29.     <h>json添加用户</h>  
  30.     姓名:<input type="text" id="userName" name="userName">  
  31.     年龄:<input type="text" id="age" name="age">  
  32.     <input type="button" id="add" value="添加">  
  33. </body>  
  34. </html>