spring mvc 与 jquery ajax
在 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的更多相关文章
- 解决Spring MVC无法接收AJAX使用PUT与DELETE请求传输的内容
解决Spring MVC无法接收AJAX使用PUT与DELETE请求传输的内容 解决方案 在 Web.xml文件中 加入以下代码 <!--解决ajax Put与Del请求无法接收到传输的内容-- ...
- Spring MVC与jQuery结合使用Ajax技术
gradle配置 group 'org.zln.webDemo' version '1.0-SNAPSHOT' apply plugin: 'java' apply plugin: 'jetty' s ...
- 基于注解的spring mvc 中使用 ajax json 的model
在 Spring mvc3中,响应.接受 JSON都十分方便. 使用注解@ResponseBody可以将结果(一个包含字符串和JavaBean的Map),转换成JSON. 使用 @RequestBod ...
- Spring MVC无法获取ajax POST的参数和值
一.怎么会这个样子 很简单的一个想法,ajax以POST的方式提交一个表单,Spring MVC解析.然而一次次的打印null折磨了我整整一天…… 最后的解决现在看来是很明显的问题,“只是当时已惘然” ...
- MVC使用jQuery.ajax()删除数据
jQuery.ajax()可以简写为$.ajax().以前有写过MVC删除的实现,如<MVC实现删除数据库记录> http://www.cnblogs.com/insus/p/336804 ...
- spring mvc后台如何处理ajax的请求,并返回json
spring mvc中有一个注解:@ResponseBody,把这个注解放到ajax请求对应的@RequestMapping(xxx)方法上,在方法体内部,把要返回的json赋给一个String类型的 ...
- asp.net mvc 接收jquery ajax发送的数组对象
<script type="text/javascript"> $(function () { var obj = { name: "军需品", m ...
- asp.net MVC 使用JQuery.Ajax
使用到:Jquery.js 以及 Newtonsoft.Json.dll 客户端调用方式: $("#ButAjax").click(function() {$.ajax({type ...
- .net mvc 用jquery ajax成功后页面跳转。
$.ajax({ //url: 'http://192.168.0.102/webApiDemo/api/WebApiTest/PostStudentInforOnePara', //url: &qu ...
随机推荐
- Linux系统目录(转载)
/ (这就是著名的根)├── bin (你在终端运行的大多数程序,比如cp.mv...)├── boot (内核放在这里,这个目录也经常被作为某个独立分 ...
- ASP.NET jQuery 随笔 在TextBox里面阻止复制、剪切和粘贴事件
当用户要输入一些密码.信用卡信息和银行账号等敏感信息,用户更希望手工通过键盘敲入数据,而好过通过剪贴板复制粘贴. 我们先来看下实现后的效果: <%@ Page Language="C# ...
- Qt中将QTableView中的数据导出为Excel文件
如果你在做一个报表类的程序,可能将内容导出为Excel文件是一项必须的功能.之前使用MFC的时候我就写过一个类,用于将grid中的数据导出为Excel文件.在使用了QtSql模块后,我很容易的将这个类 ...
- python 中函数参数传递形式
python中函数参数的传递是通过赋值来传递的.函数参数的使用又有俩个方面值得注意:1.函数参数是如何定义的 2.在调用函数的过程中参数是如何被解析 先看第一个问题,在python中函数参数的定义主要 ...
- cocos2dx进阶学习之CCBI文件
在马里奥这个游戏里,我们用到了几个ccbi文件,比如蘑菇怪,马里奥等,下面是加载马里奥代码
- Spout的实现步骤
Spout的实现步骤: · 对文件的改变进行分开的监听,并监视文件夹下有无新日志文件加入. · 在数据得到了字段的说明后,将其转换成tuple. · 声明Sp ...
- MDK常见错误详解集合
错误代码及错误信息 错误释义 error 1: Out of memory 内存溢出 error 2: Identifier expected 缺标识符 error 3: Unknown identi ...
- Minimum Window Substring @LeetCode
不好做的一道题,发现String Algorithm可以出很多很难的题,特别是多指针,DP,数学推导的题.参考了许多资料: http://leetcode.com/2010/11/finding-mi ...
- GitHub的问题
出现failed to publish the branch, 转自:http://blog.csdn.net/cucmakeit/article/details/29407329 (windows系 ...
- video.js的使用
跨浏览器地播放视频,在网上找了一下,找到了video.js,记录一下video.js的简单用法. ? 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 2 ...