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 ...
随机推荐
- A + B Problem II 大数加法
题目描述: Input The first line of the input contains an integer T(1<=T<=20) which means the number ...
- Django内置template标签
html过滤{% autoescape on|off %} {{body}} {% endautoescape %} 注释{% comment %} {% endcomment %} csrf攻击 { ...
- mongodb 限制ip访问
<pre name="code" class="python">一.限制访问IP和端口 MongoDB可以限制只允许某一特定IP来访问,只要在启动时 ...
- CUDA samples 2.3节 用CUDA示例来创建CUDA项目
2.3.1. Creating CUDA Projects for Windows 略 2.3.2 Creating CUDA Projects for Linux 默认的samples的安装路径 ...
- SICP 习题 (2.7) 解题总结 : 定义区间数据结构
SICP 习题 2.7 開始属于扩展练习,能够考虑不做,对后面的学习没什么影响.只是,假设上面的使用过程表示序对,还有丘奇计数你都能够理解的话,完毕这些扩展练习事实上没什么问题. 习题2.7是要求我们 ...
- Oracle执行计划——处理一种并行hint不生效的情况
刚刚在itpub上看到有人在问并行hint不生效的一个问题.我做了实验也出现一样的问题,如下: 原因在这是小表,在联合时走索引了,加上full的hint,就可以启动并行的执行计划. 当然也可以采用pa ...
- vim插件配置(一)
vim代码自动显示提示代码插件:AutoComplPop: 代码(普通变量函数) c/c++代码(类的 . , ->, :: 操作符)的自动补全插件: OmniCppComplete
- 什么是CALayer
一.什么是CALayer * 在iOS系统中,你能看得见摸得着的东西基本上都是UIView,比如一个按钮.一个文本标签.一个文本输入框.一个图标等等,这些都是UIView. * 其实UIView之所以 ...
- js 易错点
如下代码: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w ...
- ADO.NET 总结
一.简单介绍ADO.NET System.Data:DataTable,DataSet,DataRow,DataColumn,DataRelation,Constraint System.Data.C ...