form表單ajax提交json資料
阿新 • • 發佈:2018-11-21
前端頁面:
<form id="userInfo" > <div class="weui-cell"> <div class="weui-cell__hd"><label class="weui-label">姓名</label></div> <div class="weui-cell__bd"> <input class="weui-input" id="username" name="username" type="text" pattern="[0-9]*" placeholder="請輸入姓名"> </div> </div> <div class="weui-cell "> <div class="weui-cell__hd"> <label class="weui-label">年齡</label> </div> <div class="weui-cell__bd"> <input class="weui-input" id="age" name="age" type="number" placeholder="請輸入年齡"> </div> </div> <div class="weui-cell "> <div class="weui-cell__hd"> <label class="weui-label">地址</label> </div> <div class="weui-cell__bd"> <input class="weui-input" id="address" name="address" type="text" placeholder="請輸入地址"> </div> </div> <div class="weui-btn-area"> <a class="weui-btn weui-btn_primary" href="javascript:" id="saveUserInfo">確定</a> </div> </form>
ajax請求傳送資料
$("#saveUserInfo").click(function() { var formObject = {}; var formArray =$("#userInfo").serializeArray(); $.each(formArray,function(i,item){ formObject[item.name] = item.value; }); $.ajax({ url:"user/addUser", type:"post", contentType: "application/json; charset=utf-8", data: JSON.stringify(formObject), dataType: "json", success:function(data){ alert(data.msg); }, error:function(e){ alert("錯誤!!"); } }); });