easyui form 表單提交兩種方式
阿新 • • 發佈:2019-01-27
easyui form表單提交資料的兩種方式
第一種
$('#admin_yhgl_addUserForm').form('submit', { url : 'userAction!add.action', data : { name : $('#admin_yhgl_addUserForm input[name=name]').val(), pwd : $('#admin_yhgl_addUserForm input[name=pwd]').val() }, success : function(data) { var obj = jQuery.parseJSON(data); console.info(obj); if (obj.success) { addUserDialog.dialog('close'); } $.messager.show({ title : '提示', msg : obj.msg, timeout : 3000, showType : 'slide' }); } });
這種方式需要將form中的數值單個賦值,用到jquery 資料選擇器進行單個選擇,當form中個數比較多時,則較為繁瑣,但是程式碼易讀,當程式執行完畢則會呼叫success方法,
返回的obj資料樣式為 {"msg":"新增成功","success":true}
第二種方式採用ajax提交,比較簡便,個人比較推薦
data : $("#admin_yhgl_addUserForm").serialize() 將form中的資料序列化,只要action中變數和前臺變數名稱一致,則就會接收到值,// 第二種後臺互動方式 ajax提交 if ($('#admin_yhgl_addUserForm').form('validate')) { $.ajax({ url : 'userAction!add.action', data : $("#admin_yhgl_addUserForm").serialize(), dataType : 'json', success : function(obj, textStatus, jqXHR) { if (obj.success) { addUserDialog.dialog('close'); } $.messager.show({ title : '提示', msg : obj.msg, timeout : 3000, showType : 'slide' }); } }); } else { alert('驗證失敗'); }
表單提交之前先進行驗證