Springmvc处理ajax请求并返回json数据

所属分类: 软件编程 / java 阅读数: 74
收藏 0 赞 0 分享

①在springmvc方法上添加@ResponseBody注解,springmvc会将数据转换成json并返回;

@ResponseBody //指定返回json数据,不跳转页面
  @RequestMapping("/list")
  public List<User> list(User user){
    System.out.println("获取到异步请求数据:"+user);
    //todo 根据条件做数据库查询,返回结果集合
    ArrayList<User> users=new ArrayList<>();
    users.add(new User(1,"james",18,"男"));
    users.add(new User(2,"姚明",40,"男"));
    users.add(new User(3,"科比",46,"男"));
    return users;
  }

list.jsp页面中代码为:

<body>
  <input type="button" id="btn" value="异步加载数据"/>
  <script src="${pageContext.request.contextPath}/static/js/jquery-3.2.1.min.js"></script>
  <script>
    $(function ($) {
      $("#btn").click(function () {
        $.ajax({
          url:"${pageContext.request.contextPath}/list",
          type:"post",
          data:{"name":"james","age":18},
          dataType:"json",
          success:function (result) {
            alert("请求成功!")
            console.log(result)
          }
        })
      })
    })
  </script>
</body>

②如果contentType=”application/json”时,在方法的参数前添加@RequestBody注解,获取传递的json字符串,并封装到对象中;

@ResponseBody //指定返回json数据,不跳转页面
  @RequestMapping("/list")
  public List<User> list(@RequestBody(required=false) User user){
    System.out.println("获取到异步请求数据:"+user);
    //todo 根据条件做数据库查询,返回结果集合
    ArrayList<User> users=new ArrayList<>();
    users.add(new User(1,"james",18,"男"));
    users.add(new User(2,"姚明",40,"男"));
    users.add(new User(3,"科比",46,"男"));
    return users;
  }

list.jsp页面中代码为:

<body>
  <input type="button" id="btn" value="异步加载数据"/>
  <script src="${pageContext.request.contextPath}/static/js/jquery-3.2.1.min.js"></script>
  <script>
    $(function ($) {
      $("#btn").click(function () {
        var jsonObj={"name":"james","age":18};
        $.ajax({
          url:"${pageContext.request.contextPath}/list",
          type:"post",
          data:JSON.stringify(jsonObj),//json字符串 将json对象转化为字符串
          dataType:"json",
          contentType:"application/json",//指定以json方式传输数据
          success:function (result) {
            alert("请求成功!")
            console.log(result)
          }
        })
      })
    })
  </script>
</body>

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持脚本之家。

更多精彩内容其他人还在看

JavaWeb项目部署到服务器详细步骤详解

这篇文章主要介绍了JavaWeb项目如何部署到服务器,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧
收藏 0 赞 0 分享

IDEA基于支付宝小程序搭建springboot项目的详细步骤

这篇文章主要介绍了IDEA基于支付宝小程序搭建springboot项目的详细步骤,小编觉得挺不错的,现在分享给大家,也给大家做个参考。一起跟随小编过来看看吧
收藏 0 赞 0 分享

详解SpringBoot应用服务启动与安全终止

这篇文章主要介绍了SpringBoot应用服务启动与安全终止,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧
收藏 0 赞 0 分享

Spring Boot启动及退出加载项的方法

这篇文章主要介绍了Spring Boot启动及退出加载项的方法,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧
收藏 0 赞 0 分享

Spring Data Jpa 自动生成表结构的方法示例

这篇文章主要介绍了Spring Data Jpa 自动生成表结构的方法示例,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧
收藏 0 赞 0 分享

IDEA中osgi的开发应用指南详解

这篇文章主要介绍了IDEA中osgi的开发应用指南详解,小编觉得挺不错的,现在分享给大家,也给大家做个参考。一起跟随小编过来看看吧
收藏 0 赞 0 分享

详解用maven将dubbo工程打成jar包运行

这篇文章主要介绍了详解用maven将dubbo工程打成jar包运行,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧
收藏 0 赞 0 分享

详解Java合并数组的两种实现方式

这篇文章主要介绍了Java合并数组的两种实现方式,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧
收藏 0 赞 0 分享

使用Jenkins Pipeline自动化构建发布Java项目的方法

这篇文章主要介绍了使用Jenkins Pipeline自动化构建发布Java项目的方法,小编觉得挺不错的,现在分享给大家,也给大家做个参考。一起跟随小编过来看看吧
收藏 0 赞 0 分享

使用Maven配置Spring的方法步骤

这篇文章主要介绍了使用Maven配置Spring的方法步骤,小编觉得挺不错的,现在分享给大家,也给大家做个参考。一起跟随小编过来看看吧
收藏 0 赞 0 分享
查看更多