easyui 对form扩展
Posted liruihuan
tags:
篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了easyui 对form扩展相关的知识,希望对你有一定的参考价值。
功能描述
easyui 中 combobox 多选赋值方法如下:
$(‘#cbx‘).combobox(‘setValues‘, [‘01‘,‘02‘])
然而,业务中是以 “01,02” 的形式存储,并且 combobox 较多,为防止业务数据冗余,影响后期维护,现对 form 进行扩展 myLoad,实现 combobox 在多选(multiple = true)情况下,可以用字符串自动赋值 combobox 的操作,并且不影响 load 原有的功能,比如 "01,02" 可以直接赋值给 combobox。
代码
$.extend($.fn.form.methods, { myLoad: function (jq, param) { return jq.each(function () { load(this, param); }); function load(target, data) { if (!$.data(target, "form")) { $.data(target, "form", { options: $.extend({}, $.fn.form.defaults) }); } var options = $.data(target, "form").options; if (typeof data == "string") { var param = {}; if (options.onBeforeLoad.call(target, param) == false) { return; } $.ajax({ url: data, data: param, dataType: "json", success: function (data) { _load2(data); }, error: function () { options.onLoadError.apply(target, arguments); } }); } else { _load2(data); } function _load2(data) { var form = $(target); for (var name in data) { var val = data[name]; var rr = setChecked(name, val); if (!rr.length) { var f = form.find("input[numberboxName="" + name + ""]"); if (f.length) { f.numberbox("setValue", val); } else { $("input[name="" + name + ""]", form).val(val); $("textarea[name="" + name + ""]", form).val(val); $("select[name="" + name + ""]", form).val(val); } } setValue(name, val); } options.onLoadSuccess.call(target, data); _validate(target); }; //设置选中 function setChecked(name, val) { var form = $(target); var rr = $("input[name="" + name + ""][type=radio], input[name="" + name + ""][type=checkbox]", form); $.fn.prop ? rr.prop("checked", false) : rr.attr("checked", false); rr.each(function () { var f = $(this); if (f.val() == String(val)) { $.fn.prop ? f.prop("checked", true) : f.attr("checked", true); } }); return rr; }; //设置值 function setValue(name, val) { var form = $(target); var types = ["combotree", "combogrid", "datetimebox", "datebox"]; var comboboxTypes = ["combobox", "combo"]; var c = form.find("[comboName="" + name + ""]"); if (c.length) { for (var i = 0; i < types.length; i++) { var type = types[i]; if (c.hasClass(type + "-f")) { if (c[type]("options").multiple) { c[type]("setValues", val); } else { c[type]("setValue", val); } return; } } for (var i = 0; i < comboboxTypes.length; i++) { var comboboxType = comboboxTypes[i]; if (c.hasClass(comboboxType + "-f")) { if (c[comboboxType]("options").multiple) { if (val != null) { var valArray = val.split(",") c[comboboxType]("setValues", valArray); } } else { c[comboboxType]("setValue", val); } return; } } } }; }; } }); //表单字段验证,当所有字段都有效的时候返回true。 function _validate(target) { if ($.fn.validatebox) { var t = $(target); t.find(".validatebox-text:not(:disabled)").validatebox("validate"); var valid = t.find(".validatebox-invalid"); valid.filter(":not(:disabled):first").focus(); return valid.length == 0; } return true; };
以上是关于easyui 对form扩展的主要内容,如果未能解决你的问题,请参考以下文章
表单(上)EasyUI Form 表单EasyUI Validatebox 验证框EasyUI Combobox 组合框EasyUI Combo 组合EasyUI Combotree 组合树((代码片