使用ajax向服务端发送Form中的数据
发布时间:2020-12-16 03:00:43 所属栏目:百科 来源:网络整理
导读:前端代码: form action ="" id ="myFormUpdate" p 宠物名称: input type ="text" name ="pName" / p p 宠物类型: select name ="cId" c:forEach items ="${type}" var ="ty" option value ="${ty.cId}" ${ty.cName} / option / c:forEach / select / p p 宠
前端代码: <form action="" id="myFormUpdate"> <p>宠物名称: <input type="text" name="pName"></p> <p> 宠物类型: <select name="cId"> <c:forEach items="${type}" var="ty"> <option value="${ty.cId}">${ty.cName}</option> </c:forEach> </select> </p> <p> 宠物标签: <select name="tId"> <c:forEach items="${tags}" var="tag"> <option value="${tag.tId}">${tag.tName}</option> </c:forEach> </select> </p> <p> 当前状态: <select name="status"> <option value="available">available</option> <option value="pending">pending</option> <option value="sold">sold</option> </select> </p> <input type="hidden" name="photoUrls"/> </form> js代码: var formData = $("#myFormUpdate").serializeArray();//将表单数据序列化成数组 var data = {};//一个空的对象 for (var i = 0; i < formData.length; i++) { data[formData[i].name] = formData[i][‘value‘]//形成键值对应 } $.ajax({ type: "post",//请求方式 url: "/pet/update",//请求服务器地址 contentType: "application/json",//设置将要传输内容的编码类型 data:JSON.stringify(data),//经过序列化的对象 success: function (data) {//完成时的事件 alert(data.msg); },error: function (error) {//出现错误时的事件 alert("出现异常。"); } }); ? ?服务端代码: @RequestMapping(path = "/update",method = RequestMethod.POST) @ResponseBody public String update(@RequestBody Pet pet){ //Pet是一个实体类 return ""; } ? 运行结果: ? 继续加油。 ^_^ (编辑:李大同) 【声明】本站内容均来自网络,其相关言论仅代表作者个人观点,不代表本站立场。若无意侵犯到您的权利,请及时与联系站长删除相关内容! |