在 Spring mvc3中，响应、接受 JSON都十分方便。 
使用注解@ResponseBody可以将结果（一个包含字符串和JavaBean的Map），转换成JSON。 
使用 @RequestBody 注解前台只需要向 Controller 提交一段符合格式的 JSON，Spring 会自动将其拼装成 bean。

Spring这个转换是靠org.codehaus.jackson这个组件来实现的，所有需要引入jackson-core-asl和org.codehaus.jackson两个jar包

<title>Spring MVC</title>

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>

<script type="text/javascript" src="http://jquery-json.googlecode.com/files/jquery.json-2.2.min.js"></script>

<script type="text/javascript" src="<%=request.getContextPath()%>/scripts/user/index.js"></script>

</head>

<body>

<div id="info"></div>

<form action="add" method="post" id="form">

编号：<input type="text" name="id"/>

姓名：<input type="text" name="username"/>

年龄：<input type="text" name="age"/>

<input type="button" value="提交" id="submit"/>

</form>

</body>

</html>

html文件路径：.../webapp/views/index.html

//将一个表单的数据返回成JSON对象

$.fn.serializeObject = function() {

  var o = {};

  var a = this.serializeArray();

  $.each(a, function() {

    if (o[this.name]) {

      if (!o[this.name].push) {

        o[this.name] = [ o[this.name] ];

      }

      o[this.name].push(this.value || '');

    } else {

      o[this.name] = this.value || '';

    }

  });

  return o;

};

$(document).ready(

    function() {

      jQuery.ajax( {

        type : 'GET',

        contentType : 'application/json',

        url : 'user/list',

        dataType : 'json',

        success : function(data) {

          if (data && data.success == "true") {

            $('#info').html("共" + data.total + "条数据。<br/>");

            $.each(data.data, function(i, item) {

              $('#info').append(

                  "编号：" + item.id + "，姓名：" + item.username

                      + "，年龄：" + item.age);

            });

          }

        },

        error : function() {

          alert("error")

        }

      });

      $("#submit").click(function() {

        var jsonuserinfo = $.toJSON($('#form').serializeObject());

        alert(jsonuserinfo);

        jQuery.ajax( {

          type : 'POST',

          contentType : 'application/json',

          url : 'user/add',

          data : jsonuserinfo,

          dataType : 'json',

          success : function(data) {

            alert("新增成功！");

          },

          error : function(data) {

            alert("error")

          }

        });

      });

    });
@Controller

@RequestMapping("/user")

public class DemoController {

  private Logger logger = LoggerFactory.getLogger(DemoController.class);

  @RequestMapping(value = "/list", method = RequestMethod.GET)

  @ResponseBody

  public Map<String, Object> getUserList() {

    logger.info("列表");

    List<UserModel> list = new ArrayList<UserModel>();

    UserModel um = new UserModel();

    um.setId("");

    um.setUsername("sss");

    um.setAge();

    list.add(um);

    Map<String, Object> modelMap = new HashMap<String, Object>();

    modelMap.put("total", "");

    modelMap.put("data", list);

    modelMap.put("success", "true");

    return modelMap;

  }

  @RequestMapping(value = "/add", method = RequestMethod.POST)

  @ResponseBody

  public Map<String, String> addUser(@RequestBody UserModel model) {

    logger.info("新增");

    logger.info("捕获到前台传递过来的Model，名称为：" + model.getUsername());

    Map<String, String> map = new HashMap<String, String>();

    map.put("success", "true");

    return map;

  }

}

另外一种参数传递方式

前端代码：

$.ajax({type : "POST",

           url : "assign.v",

           data : {

               userId : userId,

               'add[]' : [,,],

               'del[]' :[]

           },

           success : function (data){

               searchWidget.searchUser();

           }

    });

后端代码：

@ResponseBody

    @RequestMapping(value="/assign",

            method=RequestMethod.POST)

    public String assign(

            @RequestParam(value="userId", required=true) int userId,

            @RequestParam(value="add[]", required=false) int[] add,

            @RequestParam(value="del[]", required=false) int[] del) {

        System.out.println("userId:" + userId);

        System.out.println("add:" + add);

        System.out.println("del:" + del);

        return "";

    }

spring mvc 与 jquery ajax的更多相关文章

  1. 解决Spring MVC无法接收AJAX使用PUT与DELETE请求传输的内容

    解决Spring MVC无法接收AJAX使用PUT与DELETE请求传输的内容 解决方案 在 Web.xml文件中 加入以下代码 <!--解决ajax Put与Del请求无法接收到传输的内容-- ...

  2. Spring MVC与jQuery结合使用Ajax技术

    gradle配置 group 'org.zln.webDemo' version '1.0-SNAPSHOT' apply plugin: 'java' apply plugin: 'jetty' s ...

  3. 基于注解的spring mvc 中使用 ajax json 的model

    在 Spring mvc3中,响应.接受 JSON都十分方便. 使用注解@ResponseBody可以将结果(一个包含字符串和JavaBean的Map),转换成JSON. 使用 @RequestBod ...

  4. Spring MVC无法获取ajax POST的参数和值

    一.怎么会这个样子 很简单的一个想法,ajax以POST的方式提交一个表单,Spring MVC解析.然而一次次的打印null折磨了我整整一天…… 最后的解决现在看来是很明显的问题,“只是当时已惘然” ...

  5. MVC使用jQuery.ajax()删除数据

    jQuery.ajax()可以简写为$.ajax().以前有写过MVC删除的实现,如<MVC实现删除数据库记录> http://www.cnblogs.com/insus/p/336804 ...

  6. spring mvc后台如何处理ajax的请求，并返回json

    spring mvc中有一个注解:@ResponseBody,把这个注解放到ajax请求对应的@RequestMapping(xxx)方法上,在方法体内部,把要返回的json赋给一个String类型的 ...

  7. asp.net mvc 接收jquery ajax发送的数组对象

    <script type="text/javascript"> $(function () { var obj = { name: "军需品", m ...

  8. asp.net MVC 使用JQuery.Ajax

    使用到:Jquery.js 以及 Newtonsoft.Json.dll 客户端调用方式: $("#ButAjax").click(function() {$.ajax({type ...

  9. .net mvc 用jquery ajax成功后页面跳转。

    $.ajax({ //url: 'http://192.168.0.102/webApiDemo/api/WebApiTest/PostStudentInforOnePara', //url: &qu ...

随机推荐

  1. vagrant 入门4

    7. 打包 Packaging , 8080 end 2. 打包Project $ vagrant package --vagrantfile Vagrantfile.pkg 8. 打包完成后,在工程 ...

  2. 6月10日－IOS应用－日记本

    嗯,经过这几天的学习,我的第一个IOS应用,日记本算是学习完毕了,下面写一篇日记,记录所学到的知识和需要继续学习的地方. 1,首先是ViewController,必须添加两个协议UITableView ...

  3. QStringLiteral（源代码里有一个通过构造函数产生的从const char*到QString的隐式转换，QStringLiteral字符串可以放在代码的任何地方，编译期直接生成utf16字符串，速度很快，体积变大）

    原作者: Olivier Goffart 点击打开链接http://woboq.com/blog/qstringliteral.html 译者: zzjin 点击打开链接http://www.tuic ...

  4. 谷歌三大核心技术（一）The Google File System中文版

    谷歌三大核心技术(一)The Google File System中文版  The Google File System中文版 译者:alex 摘要 我们设计并实现了Google GFS文件系统,一个 ...

  5. 淘宝PK京东：哥刷的不是广告，刷的是存在

    冯强/文 (昨晚看阿根廷vs瑞士时手机上敲的,看完太激动忘发了,现配了图发上来) 这两天,关于京东.淘宝渠道下沉的新闻中,两家略带喜感的农村墙体广告在互联网上传播,例如以下图: 京东这图片,越看越像P ...

  6. stm32之USART通信

    任何USART通信,需要用到2个对外连接的引脚:RxD,TxD: RxD是输入引脚,用于串行数据接收: TxD是输出引脚,用于串行数据发送: SCLK引脚:发生器时钟输出(同步模式下,异步模式下不需要 ...

  7. window下如何搭建linux环境

    1.使用虚拟机 使用VMware虚拟机,下载linux内核系统,加载运行. 2.cygwin 安装cygwin,设置环境变量. 第二种方法还是比较简便的.优先考虑.

  8. linux中/etc与/var目录，各是什么意思？这两个目录下的文件有什么特点？

    http://zhidao.baidu.com/link?url=DkxU9CyhJb_dIUAPCmPmxRtQsENgCzqy5qnLPEj_V9DqNzdt6Qya0U5iCVRCYFkgoRo ...

  9. portal---easyui

    一,效果图. 二,源代码. <!doctype html><html><head> <meta http-equiv="Content-Type&q ...

  10. 一个Java程序的执行过程（转）

    我们手工执行java程序是这样的:  1.在记事本中或者是UE的文本编辑器中,写好源程序:  2.使用javac命令把源程序编译成.class文件:    编译后的.class(类字节码)文件中会包含 ...