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

所属分类: 软件编程 / java 阅读数: 113
收藏 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>

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

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

Java实现一个简单的文件上传案例示例代码

这篇文章主要介绍了Java实现一个简单的文件上传案例,本文通过实例代码给大家介绍的非常详细,对大家的学习或工作具有一定的参考借鉴价值,需要的朋友可以参考下
收藏 0 赞 0 分享

详解在spring中使用JdbcTemplate操作数据库的几种方式

这篇文章主要介绍了详解在spring中使用JdbcTemplate操作数据库的几种方式,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧
收藏 0 赞 0 分享

java中的switch case语句使用详解

这篇文章主要介绍了java中的switch case语句使用详解,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧
收藏 0 赞 0 分享

深入理解Java 线程池

这篇文章主要介绍了Java 线程池的相关资料,文中讲解非常细致,帮助大家更好的理解和学习,感兴趣的朋友可以了解下
收藏 0 赞 0 分享

详解mybatis #{}和${}的区别、传参、基本语法

这篇文章主要介绍了mybatis #{}和${}的区别、传参、基本语法,本文给大家介绍的非常详细,对大家的学习或工作具有一定的参考借鉴价值,需要的朋友可以参考下
收藏 0 赞 0 分享

MyBatis 中 ${}和 #{}的正确使用方法(千万不要乱用)

这篇文章主要介绍了MyBatis 中 ${}和 #{}的正确使用方法,本文给大家提到了MyBatis 中 ${}和 #{}的区别,本文通过实例代码给大家介绍的非常详细,对大家的学习或工作具有一定的参考借鉴价值,需要的朋友可以参考下
收藏 0 赞 0 分享

详解Mybatis中的 ${} 和 #{}区别与用法

这篇文章主要介绍了Mybatis中的 ${} 和 #{}区别与用法,本文给大家介绍的非常详细,对大家的学习或工作具有一定的参考借鉴价值,需要的朋友可以参考下
收藏 0 赞 0 分享

Maven安装过程图文详解

这篇文章主要介绍了Maven安装过程,本文通过图文并茂的形式给大家介绍的非常详细,对大家的学习或工作具有一定的参考借鉴价值,需要的朋友参考下吧
收藏 0 赞 0 分享

SpringBoot登录拦截配置详解(实测可用)

这篇文章主要介绍了SpringBoot登录拦截配置详解(实测可用),文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧
收藏 0 赞 0 分享

JAVA 内存溢出案例汇总

这篇文章主要介绍了JAVA 内存溢出案例的汇总,文中讲解非常细致,帮助各位工作学习时避免内存溢出,感兴趣的朋友可以了解下
收藏 0 赞 0 分享
查看更多