前端与后台springMVC之JSon数据交互
后台将数据变成json传递给前台,可以通过@ResponseBody注解来实现
前台传递一个Json数据给后台,如果后台希望能够通过map或者实体类来接收的话,那么map集合或者实体类前面需要添加一个@requestBody注解
将前端数据变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;
return JSON.stringify(o);
};
前端代码
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8" isELIgnored="false"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme() + "://" + request.getServerName() + ":" + request.getServerPort()
+ path + "/";
%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<base href="<%=basePath%>">
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>注册界面</title>
<script type="text/javascript"
src="<%=basePath%>/resources/js/jquery.min.js"></script>
</head>
<body>
<center>
<form action="#" method="post" onsubmit="return false" id="form1">
<table>
<tr>
<td>昵称</td>
<!-- pattern="[\u4e00-\u9fa5]{4,10}" -->
<td><input type="text" name="nick"
value="${errorMessage.nick==null?info.nick:'' }"
required="required" placeholder="请输入4-10位汉字"><span
style="color: red;">${errorMessage.nick }</span></td>
</tr>
<tr>
<td>密码</td>
<!-- pattern="\w{3,6}" -->
<td><input type="password" name="password" required="required"
placeholder="请输入3-6位数字、字母、下划线组合"><span style="color: red;">${requestScope.errorMessage.password }</span></td>
</tr>
<tr>
<td>手机号码</td>
<td><input type="text" name="phone" pattern="1[3578]\d{9}"
required="required" placeholder="请输入正确的手机格式"></td>
</tr>
<tr>
<td>邮箱</td>
<td><input type="email" name="email" required="required"
placeholder="请输入正确的邮箱格式"></td>
</tr>
<tr>
<td>年龄</td>
<td><input type="number" name="age" max="150" min="1"
required="required" placeholder="请输入您的年龄"><span
style="color: red;">${requestScope.errorMessage.age }</span></td>
</tr>
<tr>
<td colspan="2"><input type="submit" value="注册"> <input
type="reset" value="重置"></td>
</tr>
</table>
</form>
</center>
<script type="text/javascript">
//jquery的工具类
$.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;
return JSON.stringify(o);
};
$("input[type=submit]").click(function() {
$.ajax({
url : '<%=basePath%>/front/getJson.shtml',
type : 'post',
dataType : 'json',
contentType : 'application/json',
data : $("#form1").serializeObject(),
success : function(flag) {
alert(flag);
}
});
});
</script>
</body>
</html>
controller层
//获取register.jsp页面传递过来json的数据
@RequestMapping("getJson")
@ResponseBody//将后台数据变为json传给前台
// public boolean getJson(@RequestBody Map<String, Object> jsonMap){//@RequestBody将前台数据json转为map给后台
public boolean getJson(@RequestBody QQ jsonMap){
System.out.println("getJson" + jsonMap);
return true;
}
总结
- springMVC与struts2框架有什么区别?
springMVC的核心控制器是一个Servlet(DispatcherServlet);而Struts2的核心控制器是filter(StrutsPreparedAndExecuteFilter)。 - 说一下spring实现事务的几种方式?
第一种:通过注解(@Transactional)
第二种:通过xml配置文件
- springMVC中@RequestBody与@ResponseBody的区别
@ReponseBody:将后台返回的数据(实体类、map、list、基本数据类型等)转成json,返回给前台
@RequestBody:将前台传递过来的json数据用map或者实体类或者List来接收。如果与ajax交互,则需要给ajax一个响应 - springMVC如何实现重定向与转发(注意事项:controller方法前不能加@ResponseBody注解)
第一步:将controller方法的返回值改成String类型,如果返回值为:“return forward:转发路径”
代表转发。
第二步:将controller方法的返回值改成String类型,如果返回值为:“return redirect:重定向路径”
代表重定向。 - springMVC如何将数据带入到jsp页面?
有三种方式:model、request、map