ssm框架从controller层返回json格式数据到页面
2020-09-05 19:23
357 查看
通常前端页面发送ajax请求,我们只需要返回json格式数据就行
1.在pom.xml加入依赖
<properties> <jackson.version>2.5.4</jackson.version> </properties> <dependencies> <!-- controller返回json --> <dependency> <groupId>com.fasterxml.jackson.core</groupId> <artifactId>jackson-core</artifactId> <version>${jackson.version}</version> </dependency> <dependency> <groupId>com.fasterxml.jackson.core</groupId> <artifactId>jackson-databind</artifactId> <version>${jackson.version}</version> </dep 20000 endency>
2.dispatcherServlet-servlet.xml中配置
<!-- 两个标准配置 --> <!-- 将springmvc 不能处理的请求交给tomcat 例如静态资源 --> <mvc:default-servlet-handler/> <mvc:annotation-driven> <mvc:message-converters> <bean class="org.springframework.http.converter.StringHttpMessageConverter"/> <bean class="org.springframework.http.converter.json.MappingJackson2HttpMessageConverter"/> </mvc:message-converters> </mvc:annotation-driven>
3.在controller中获取返回的json数据
@Controller public class EmployeeController { // 查询所有员工 @Autowired EmployeeService employeeService; @RequestMapping("emps") @ResponseBody public List<Employee> getEmps() { List<Employee> emps=employeeService.getAll(); System.out.println("emps "+emps.size()); return emps; } }
4.测试(使用postman)
5.前端接收数据并解析
渲染界面
<script> $(document).ready(function(){ $(function(){ $.ajax({ url:"empsJson", data:"pn=1", type:"get", success:function(data){ //获取controller传来的json数据 //alert(data[0].empId); //alert(data.length) empInfo(data); } }) }) }) function empInfo(data){ var str=""; for(var i=0;i<data.length;i++){ str+="<tr>"+ "<td>"+data[i].empId+"</td>"+ "<td>"+data[i].empName+"</td>"+ "<td>"+data[i].gender+"</td>"+ "<td>"+data[i].email+"</td>"+ "<td>"+data[i].dId+"</td>"+ "</tr>"; } $("tbody").html(str) //下面这两种加上没有样式 /* for(var i=0;i<data.length;i++){ var tr=$("tbody").append("<tr></tr>"); tr.append("<td>"+data[i].empId+"</td>"); tr.append("<td>"+data[i].empName+"</td>"); tr.append("<td>"+data[i].gender+"</td>"); tr.append("<td>"+data[i].email+"</td>"); tr.append("<td>"+data[i].dId+"</td>"); } */ /* $.each(data,function(i,data){ var tr=$("tbody").append("<tr></tr>"); tr.append("<td>"+data.empId+"</td>"); tr.append("<td>"+data.empName+"</td>"); tr.append("<td>"+data.gender+"</td>"); tr.append("<td>"+data.email+"</td>"); tr.append("<td>"+data.dId+"</td>"); }) */ } </script>
ajax发送多个参数
发送
接收
相关文章推荐
- ssm框架 返回 json格式数据
- Jquery DataTable AJAX跨域请求的解决方法及SSM框架下服务器端返回JSON格式数据的解决方法
- Jquery Ajax 学习实例2 向页面发出请求 返回JSon格式数据
- SSM框架返回JSON数据,报405、406错误的解决方法
- Jquery Ajax 学习实例2 向页面发出请求 返回JSon格式数据
- php查询mysql中的数据,并将结果返回为JSON格式,提取JSON中的数据,写入页面不同的id号中
- SSM编写http接口返回JSON格式数据
- 在ssm框架中前后台数据交互均使用json格式
- Jquery Ajax学习实例2-向页面发出请求,返回JSon格式数据
- 使用spring-mvc 框架返回json格式数据 报406
- SSM将后台获取的数据转换成json格式传递到前台页面
- SSH三大框架集成中,使用jQuery框架 Ajax技术返回json格式的数据(二)
- 关于webwork框架返回JSON数据格式的问题2015-10-27
- SSM框架:解决后台传数据到前台中文乱码问题,使用@ResponseBody返回json 中文乱码
- SpringMVC框架-18:返回Json数据格式
- ajax根据ID查询数据库并返回Json格式数据返回js,使用append显示到页面。判断json值为[]或者[[]]的问题。
- Ajax调用查看页面的后台返回json格式数据
- 解决Asp.net Mvc返回JsonResult中DateTime类型数据格式的问题
- Android解析相同接口返回不同格式json数据的方法
- SSM框架下使用JSON和AJAX进行前后端数据传输