java接收前台的json数据的⼏种⽅式使⽤ajax向后台传递参数,使⽤参数绑定的⽅式笔记:
第⼀种,使⽤@RequestParam逐个对应接收:
js代码:
var url = "/rest/register";
var phoneNo = $("#mobile").val();
var nickname=$("#nickname").val();
var password = $("#signPwd").val();
var code = $('#mobileValidateCode').val();
//判断注册⾓⾊(默认为投资⼈⾓⾊)
var role=2;
var rs = null;
$(".reg-items :input").attr("disabled", true);
$.ajax({
data:({
"phoneNo" : phoneNo,
"nickname" : nickname,
"password" : password,
"role" : role,
"code":code,
"spreadCode": $("#spreadCode").val()
}),
url:url,
type:"POST",
dataType:"json",
cache : false,
success:function(data){
}
});
后台代码:
@RequestMapping(value = "register", method = RequestMethod.POST)
public CommonResult<String> register(
@RequestParam("phoneNo") String phoneNo,
@RequestParam("nickname") String nickname,
@RequestParam("password") String password,
@RequestParam("role") int role, @RequestParam("code") String code,
@RequestParam(required = false, value="spreadCode") String spreadCode,
HttpServletRequest request)
此种⽅法使⽤起来简单直接,不宜出错,缺点也很明显,⽅法的参数列表过长。
第⼆种:使⽤@ModelAttribut进⾏参数绑定  html代码:
<form id="ybdForm">
<ul class="login-items">
<li>
<div class="input-div">姓名</div>
<input type="text" id="userName" name="userName" class="input" placeholder="请输⼊姓名">
<div class="error" id="userNameError"></div>
</li>
<li>
<div class="input-div">昵称</div>
<input type="text" id="nickName" name="nickName" class="input" placeholder="请输⼊昵称">
<div class="error" id="nickNameError"></div>
</li>
<li>
<div class="input-div">⼿机号码</div>
<input type="text" id="phone" name="phone" class="input" placeholder="请输⼊⼿机号码">
<div class="error" id="phoneError"></div>
</li>
<li>
<div class="input-div">⾝份证号码</div>
<input type="text" id="idCard" name="idCard" class="input" placeholder="请输⼊⾝份证号码">
<div class="error" id="idCardError"></div>
</li>
<li>
<div class="input-div">贷款⾦额</div>
<input type="text" name="loanAmount" id="loanAmount" class="input" placeholder="请输⼊贷款⾦额">
<div class="error" id="loanAmountError"></div>
</li>
<li>
<div class="input-div">图⽚验证码</div>
<input type="text" name="imgCode" id="imgCode" class="input" placeholder="请输⼊图⽚验证码">
<div class="authImage">
<a href="javascript:refreshImageCode();">
<img id="imageCode" alt="" src="/authImage" />
</a>
</div>
<div class="codeTime">
<a href="javascript:refreshImageCode();">看不清,换⼀张</a>
</div>
<div class="error" id="imgCodeError"></div>
</li>
<li>
<div class="input-div">⼿机验证码</div>
<input type="text" name="smsCode" id="smsCode" class="input" placeholder="请输⼊⼿机验证码">
<div class="sms-code">
<a href="javascript:sendVerifycodeByMobile();" class="r3 getVerifyType getVerify-Valid" id="msgCode">短信获取</a>                </div>
input标签placeholder属性
<div class="codeTime" id="phoneCode" >
60秒后重新获取
</div>
<div class="error" id="smsCodeError"></div>
</li>
</ul>
<div class="login-area">
<div class="login-button">
<div class="loginAnNiu" οnclick="Loan();"></div>
</div>
<div class="login-server">
<font>已有帐号?</font>
<a href="/login/login.html" ><font class="mimaFont">请登录</font></a>
</div>
</div>
</form>
js代码:
$.ajax({
type:"POST",
data:$('#ybdForm').serialize(),
url:"/rest/applyLoan",
cache : false,
success:function(result){}
});
java代码:
@RequestMapping(value="applyLoan",method=RequestMethod.POST)
public CommonResult<Map<String, String>> applyLoan(
@ModelAttribute ApplyView apply, HttpServletRequest request) {}
使⽤参数绑定,避免了后台重新初始化对象所带来的冗余代码,需要着重提醒的是:ApplyView接收对象中的属性名必须与form表单中需要提交的<input>标签或其他标签的name属性完全对应
第三种:使⽤@RequestBody进⾏参数绑定(以传递数组为例)
js代码:
var waitRegistArray = [];
$(":checkbox[name=checkboxBtn][checked=checked]").each(function(){
var regist = waitRegist[$(this).val()];
var  data={"name":regist.name,"phoneNo":regist.phoneNo,"cardNo":regist.cardNo};
waitRegistArray.push(data);
});
$.ajax({
url:"rest/batchRegist",
data:JSON.stringify(waitRegistArray),
contentType:"application/json",
type:"POST",
dataType:"json",
async: false,
cache:false,
success:function(result){}
})
java代码:
@RequestMapping(value="batchRegist",method=RequestMethod.POST)
public CommonResult<String> batchRegist(@RequestBody List<User> users){}
json数组以List集合⽅式接收,其中User对象属性与数组中的对象属性名对应!

版权声明:本站内容均来自互联网,仅供演示用,请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198,我们将在24小时内删除。