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 ...
随机推荐
- C语言之六大排序算法
排序算法 1.直接插入排序 直接插入排序是将原始数据依次从已排好序的序列的最右侧比较起,若小于则向前插,一直插到合适的位置即可. 源代码如下: #include<stdio.h> void ...
- 第四节 二维条码与磁卡、IC卡、光卡之比较
二维条码同其他几种自动识别技术的比较可见下表: 比较点 二维条形码 磁卡 IC卡 光卡 抗磁力 强 弱 中等 强 抗静电 强 中等 中等 强 抗损性 强可折叠可局部穿孔可局部切割 弱不可折叠不可穿孔不 ...
- 动态规划 最长公共子序列 LCS,最长单独递增子序列，最长公共子串
LCS:给出两个序列S1和S2,求出的这两个序列的最大公共部分S3就是就是S1和S2的最长公共子序列了.公共部分 必须是以相同的顺序出现,但是不必要是连续的. 选出最长公共子序列.对于长度为n的序列, ...
- Windows Azure 社区新闻综述（#77 版）
欢迎查看最新版本的每周综述,其中包含有关云计算和 Windows Azure 的社区推动新闻.内容和对话.以下是本周的亮点. 文章.视频和博客文章 · 文章: Windows Azure 表存储简 ...
- 基于visual Studio2013解决C语言竞赛题之0404循环求和
题目 解决代码及点评 这道题考验for循环和一个简单的算法 因为每次累加的值有规律,后面一次累加是前面一次累加的两倍 所以可以用简单的循环,计算累加项和累加结果 /************ ...
- leetcode_question_62 Unique Paths
A robot is located at the top-left corner of a m x n grid (marked 'Start' in the diagram below). The ...
- 静态化 - 伪静态技术（PHP正则表达式实现）
效果: 代码: <?php // + —— —— —— —— —— —— —— —— —— —— —— —— —— —— —— —— —— —— —— —— —— —— // + 正则表达式,实 ...
- spark sql 基本用法
一.通过结构化数据创建DataFrame: publicstaticvoid main(String[] args) { SparkConf conf = new SparkConf() .se ...
- js 实现图片间隔循环轮播以及没有间隔的循环轮播
链接地址:http://blog.sina.com.cn/s/blog_75cf5f32010199dn.html 最近做了个图片循环轮播的功能.就是几张图片不断的循环滚动显示. 感觉这个方法不错所以 ...
- Tomcat 内存设置
大型项目或者使用了SSH 的话, Tomcat 可能会报 java.lang.OutOfmemoryError: PermGen Space Windows: 在 bin/catlina.bat 最上 ...