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

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

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

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

SpringBoot中使用Ehcache的详细教程

EhCache 是一个纯 Java 的进程内缓存框架,具有快速、精干等特点,是 Hibernate 中默认的 CacheProvider。这篇文章主要介绍了SpringBoot中使用Ehcache的相关知识,需要的朋友可以参考下
收藏 0 赞 0 分享

在idea 中添加和删除模块Module操作

这篇文章主要介绍了在idea 中添加和删除模块Module操作,具有很好的参考价值,希望对大家有所帮助。一起跟随小编过来看看吧
收藏 0 赞 0 分享

java spring整合junit操作(有详细的分析过程)

这篇文章主要介绍了java spring整合junit操作(有详细的分析过程),具有很好的参考价值,希望对大家有所帮助。一起跟随小编过来看看吧
收藏 0 赞 0 分享

详解JAVA 弱引用

这篇文章主要介绍了 JAVA 弱引用的相关资料,帮助大家更好的理解和学习java引用对象,感兴趣的朋友可以了解下
收藏 0 赞 0 分享

深入了解JAVA 虚引用

这篇文章主要介绍了JAVA 虚引用的相关资料,帮助大家更好的理解和学习JAVA,感兴趣的朋友可以了解下
收藏 0 赞 0 分享

详解JAVA 强引用

这篇文章主要介绍了JAVA 强引用的相关资料,帮助大家更好的理解和学习,感兴趣的朋友可以了解下
收藏 0 赞 0 分享

java中的按位与(&)用法说明

这篇文章主要介绍了java中的按位与(&)用法说明,具有很好的参考价值,希望对大家有所帮助。一起跟随小编过来看看吧
收藏 0 赞 0 分享

深入了解JAVA 软引用

这篇文章主要介绍了JAVA 软引用的相关资料,帮助大家更好的理解和学习,感兴趣的朋友可以了解下
收藏 0 赞 0 分享

利用MyBatis实现条件查询的方法汇总

这篇文章主要给大家介绍了关于利用MyBatis实现条件查询的相关资料,文中通过示例代码介绍的非常详细,对大家的学习或者使用MyBatis具有一定的参考学习价值,需要的朋友们下面来一起学习学习吧
收藏 0 赞 0 分享

Intellij IDEA 与maven 版本不符 Unable to import maven project See logs for details: No implementation for org.apache.maven.model.path.PathTranslator was bound

这篇文章主要介绍了Intellij IDEA 与maven 版本不符 Unable to import maven project See logs for details: No implementation for org.apache.maven.model.path.Pa
收藏 0 赞 0 分享
查看更多