controller返回json数据还是对象(mysql数据库建表的完整步骤)

通过前端页面发送ajax请求,我们只需要返回json格式数据就行 1.在pom.xml加入依赖 <properties> <jackson.version>2.5.4</jackson.version> </properties> <dependencies> <!–controller返回json–> <depen…

通过前端页面发送ajax请求,我们只需要返回json格式数据就行

1.在pom.xml加入依赖

controller返回json数据还是对象(mysql数据库建表的完整步骤)

<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>
    </dependency>

2.dispatcherServlet-servlet.xml中配置

controller返回json数据还是对象(mysql数据库建表的完整步骤)

 <!-- 两个标准配置 -->
       <!-- 将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返回json数据还是对象(mysql数据库建表的完整步骤)

@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)

controller返回json数据还是对象(mysql数据库建表的完整步骤)

5.前端接收数据并解析

controller返回json数据还是对象(mysql数据库建表的完整步骤)

渲染界面

controller返回json数据还是对象(mysql数据库建表的完整步骤)

<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发送多个参数

发送

controller返回json数据还是对象(mysql数据库建表的完整步骤)

接收

controller返回json数据还是对象(mysql数据库建表的完整步骤)

本文来自投稿,不代表来拓客立场,如若转载,请注明出处:https://www.laituoke.com/ltk/5892.html