1、表單取值
我們指定一個dom屬性的值來標志每個文本框對應的接口字段，本文這里使用 data-field 自定義屬性，也可以使用name屬性，都可以。
html：指定data-field屬性的值
<body> <div class="easyui-layout" data-options="fit:true"> <div data-options="region:'center',border: false"> <input id="txtName" class="easyui-textbox" data-field="UserName" width:200,height:22,label:'名稱:' ,labelWidth:50,labelAlign:'right' /> <input id="txtTel" class="easyui-textbox" data-field="UserTel" width:200,height:22,label:'電話:' ,labelWidth:50,labelAlign:'right' /> </div> </div> </body>
js：自動獲取所有文本框，並組成json數據
// 定義變量
var formData = {}; // 獲取表單所有字段和相應值 裝填到formData變量中 var fields = $("[data-field]");
fields.each(function (index, item) { if ($(item).hasClass("textbox-f")) { $(item).next().find(".textbox-value").each(function (index2, item2) {
// 根據dom節點的自定義屬性[data-field]來定義json對象的字段名 formData[item.dataset.field] = item2.value; // 若組件為combobox或combo或combogrid或combotreegrid則會獲取到所選項的value值，非text值
});
} else {
// 若不是easyui組件，則獲取原生標簽的值
formData[item.dataset.field] = item.value;
}
});
$.ajax({ url: 'FkdzService.ashx', type: 'post', async: true, dataType: 'json', data: formData, success: function (result, status, xmlHttpRequest) { }, error: function (status) { }, complete: function (xmlHttpRequest, status) { } });
2、表單賦值
//示例數據
var main = { UserName: "蝸牛", UserTel: "10086" }; //表單賦值 $("[data-field]").each(function (index, item) {
if ($(item).hasClass("combobox-f")) {
//combobox $(item).combobox("setValue", main[item.dataset.field]);
} else if ($(item).hasClass("textbox-f")) {
//textbox $(item).textbox("setValue", main[item.dataset.field]);
} else {
//原生標簽 $(item).val(main[item.dataset.field]);
} });