使用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" style="height: 45px;"/> </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> <div class="codeTime" id="phoneCode" style="display: none;"> 60秒后重新获取 </div> <div class="error" id="smsCodeError"></div> </li> </ul> <div class="login-area"> <div class="login-button"> <div class="loginAnNiu" onclick="Loan();"></div> </div> <div class="login-server"> <font>已有帐号?</font> <a href="/login/login.html" style="text-decoration: none;"><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对象属性与数组中的对象属性名对应!
相关推荐
主要给大家介绍了关于SpringMVC接收与响应json数据的几种方式,文中通过示例代码介绍的非常详细,对大家的学习或者使用springmvc具有一定的参考学习价值,需要的朋友们下面来一起学习学习吧
主要介绍了Java实现后台发送及接收json数据的方法,结合实例形式分析了java针对json格式数据的传输与操作相关技巧,需要的朋友可以参考下
本文给大家总结一下java转json串的几种方式,每种方式通过实例代码给大家介绍的非常详细,感兴趣的朋友跟随脚本之家小编一起学习吧
主要介绍了ThinkPHP中使用ajax接收json数据的方法,包括了前台js代码与对应的PHP处理代码,非常具有实用价值,需要的朋友可以参考下
使用Java获取制定接口的数据,使用了httpserverletrequest类。
主要介绍了如何处理后台向前台传递的json数据,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友可以参考下
本篇文章主要介绍了解决SpringMvc后台接收json数据中文乱码问题的几种方法,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
主要介绍了基于java解析JSON的三种方式,结合实例形式详细分析了json解析的原理与GSON、FastJSON等常用解析操作技巧,需要的朋友可以参考下
本篇文章主要介绍了springmvc 接收json对象的两种方式,具有一定的参考价值,有需要的可以了解一下。
主要介绍了Java后台处理Json格式数据的方法的相关资料,非常不错具有参考借鉴价值,需要的朋友可以参考下
主要介绍了Java Http请求传json数据乱码问题的解决,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧
主要介绍了java生成json数据示例,需要的朋友可以参考下
JAVA在线接收解析JSON数据,引用的JSON类为 net.sf.json.JSONArray; net.sf.json.JSONObject;
主要介绍了Java几种常用JSON库性能比较详解,小编觉得挺不错的,现在分享给大家,也给大家做个参考。一起跟随小编过来看看吧
主要介绍了Java 实现Redis存储复杂json格式数据并返回给前端操作,具有很好的参考价值,希望对大家有所帮助。一起跟随小编过来看看吧
主要介绍了jQuery实现异步获取json数据的2种方式,主要讲述了$.getJSON方法与$.ajax方法,非常实用,需要的朋友可以参考下