EasyUi表单取值，表单赋值，非官方form提交，可轻松扩展
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]);
} });
