在 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. fstream,ifstream,ofstream 详解与用法

    fstream,istream,ofstream 三个类之间的继承关系 fstream :(fstream继承自istream和ofstream)1.typedef basic_fstream< ...

  2. 第一种:NStread

    - (void)viewDidLoad { [super viewDidLoad]; // Do any additional setup after loading the view, typica ...

  3. X Window System介绍

    1.概述     X Window System是1984年由麻省理工学院(MIT)和DEC公司共同开发研究的,是执行在UNIX系统上的视窗系统.严格地说,X Window System并非一个软件, ...

  4. B. Friends and Presents(Codeforces Round #275(div2)

    B. Friends and Presents time limit per test 1 second memory limit per test 256 megabytes input stand ...

  5. 【SVN】is out of date

    右击项目(team->update 或者 team->freash/cleanup),再操作,提交就可以了.

  6. BZOJ 1911: [Apio2010]特别行动队( dp + 斜率优化 )

    sum为战斗力的前缀和 dp(x) = max( dp(p)+A*(sumx-sump)2+B*(sumx-sump)+C )(0≤p<x) 然后斜率优化...懒得写下去了... ------- ...

  7. Chapter 12 外观模式

    外观模式:为子系统中的一组接口提供一个一致的界面,此模式定义了一个高层接口,这个模式使得这一子系统更加容易使用. 外观模式三个阶段: 首先,在设计初期阶段,应该要有意识的将不同的两个层分离. 其次,在 ...

  8. 一个load飙高的过程分析,非常有价值(转)

    关于us高和sy高的问题分析: 当us值过高时,表示运行的应用消耗大量的CPU.java应用造成us高的原因主要是线程一直处于可运行(Runnable)状态,通常这些线程在执行无阻塞.循环.正则或纯粹 ...

  9. 【Demo 0025】注册/反注册窗体类RegisterClassEx/UnregisterClass

    所有窗体在创建前都必须注册窗体类,只有注册的窗体类才被系统认知并允许实例化,换句话说通过注册告诉进程窗体管理器此类窗体的属性如: 背景色,窗体上的鼠标样式以及窗体事件处理函数等;  有一些控件类系统自 ...

  10. MapReduce调度与执行原理之任务调度(续)

    前言 :本文旨在理清在Hadoop中一个MapReduce作业(Job)在提交到框架后的整个生命周期过程,权作总结和日后参考,如有问题,请不吝赐教.本文不涉及Hadoop的架构设计,如有兴趣请参考相关 ...