jQuery自动给表单赋值,jQuery表单赋值,jQuery表单赋值json
/* * jquerybiao表单赋值,传入一个json对象,为form赋值 * 作者:blank * 邮箱:996991818.com *注释 *1、此方法能赋值一般所有表单。 *2、此插件现在只接收json赋值,不考虑到其他的来源数据 *3、对于特殊的textarea,比如CKEditor,kindeditor...,他们的赋值有提供不同的自带方法,这里不做统一, * 如果项目中有用到,不能正确赋值,请单独赋值 * 注:name 都要小写 不支持大写和大小写混用! * 更新日志: * 2018-09-25:select value值 支持大小写,但是不支持大小写混用 * 2018-10-26:支持时间插件。 * 2018-11-01:时间格式化部分加验证 null 不做格式化 * 2018-11-20:支持checkbox、新增一个获取表单 包括checkbox 和redio 、重置界面功能新增 * 2018-11-21:当前时间加减js方法新增 * 2018-11-22:支持disabled属性取值。 * 2018-11-27:获取表单添加2个方法。Get_FormArray 和 Get_FormOneArray * 2018-12-11:Get_FormOneArray_List、Get_Form_List方法新增 可以用class 选多个表单数据 推荐用Get_FormOneArray_List */ (function ($) { $.fn.extend({ //赋值表单 Set_Form: function (options) { //默认参数 var defaults = { jsonValue: "", isDebug: false //是否需要调试,这个用于开发阶段,发布阶段请将设置为false,默认为false,true将会把name value打印出来 } //设置参数 var setting = $.extend({}, defaults, options); var form = this; jsonValue = setting.jsonValue; //如果传入的json字符串,将转为json对象 if ($.type(setting.jsonValue) === "string") { jsonValue = $.parseJSON(jsonValue); } //如果传入的json对象为空,则不做任何操作 if (!$.isEmptyObject(jsonValue)) { var debugInfo = ""; $.each(jsonValue, function (key, value) { //是否开启调试,开启将会把name value打印出来 if (setting.isDebug) { alert("name:" + key + "; value:" + value); debugInfo += "name:" + key + "; value:" + value + " || "; } var formField = form.find("[name='" + key.toLowerCase() + "']"); if ($.type(formField[0]) === "undefined") { if (setting.isDebug) { alert("can not find name:[" + key + "] in form!!!"); //没找到指定name的表单 } } else { var fieldTagName = formField[0].tagName.toLowerCase(); if (fieldTagName == "input") { if (formField.attr("type") == "radio") { $("input:radio[name='" + key.toLowerCase() + "'][value='" + value + "']").attr("checked", "checked"); } else if (formField.attr("type") == "checkbox") { if (value == "1" || value == "true" || value == "True") { $("input:checkbox[name='" + key.toLowerCase() + "']").prop("checked", "checked"); } else { $("input:checkbox[name='" + key.toLowerCase() + "']").prop("checked", ""); } } else if (formField.attr("fromat") != "" && formField.attr("fromat") != undefined && formField.attr("fromat") != null) { if (value != null) { value = value.toLowerCase().replace("t", " ") switch (formField.attr("fromat").toLowerCase()) { case "yyyy-mm-dd": formField.val(value.match(/\d{4}-\d{2}-\d{2}/g)); break; case "dd:hh:mm": formField.val(value.match(/\d{2}:\d{2}:\d{2}/g)); break; case "yyyy-mm-dd dd:hh:mm": formField.val(value.match(/\d{4}-\d{2}-\d{2} \d{2}:\d{2}:\d{2}/g)); break; } } } else { formField.val(value); } } else if (fieldTagName == "select") { if (!isNaN(value)) { formField.val(value);//数字 } else { formField.val(value.toLowerCase());//小写赋值 formField.val(value.toUpperCase());//大写赋值 } } else if (fieldTagName == "textarea") { formField.val(value); } else { formField.val(value); } } }) if (setting.isDebug) { alert(debugInfo); } } return form; //返回对象,提供链式操作 }, //获取表单数据 ftopicno=&ftopicname=&supnamecn=&createtime_strat= Get_Form: function () { var list = this.serializeArray(); var $radio = $('input[type=radio],input[type=checkbox]', this); var temp = {}; $.each($radio, function () { if (!temp.hasOwnProperty(this.name)) { if ($("input[name='" + this.name + "']:checked").length == 0) { temp[this.name] = ""; list.push({ name: this.name, value: "" }); } } }); var disabledlist = $('input[disabled=disabled]', this); for (var i = 0; i < disabledlist.length; i++) { list.push({ name: disabledlist[i].name, value: disabledlist[i].value }); } return jQuery.param(list); }, //获取表单数据OneArray {"name":"ftopicno","value":"","value":""} Get_FormOneArray: function () { var list = this.serializeArray(); var $radio = $('input[type=radio],input[type=checkbox]', this); var temp = {}; $.each($radio, function () { if (!temp.hasOwnProperty(this.name)) { if ($("input[name='" + this.name + "']:checked").length == 0) { temp[this.name] = ""; list.push({ name: this.name, value: "" }); } } }); var disabledlist = $('input[disabled=disabled]', this); for (var i = 0; i < disabledlist.length; i++) { list.push({ name: disabledlist[i].name, value: disabledlist[i].value }); } var onejson = {}; for (var i = 0; i < list.length; i++) { if (list[i].value == "" || list[i].value == "null" || list[i].value == "undefined" || list[i].value == null || list[i].value == undefined) { onejson[list[i].name] = null; } else { onejson[list[i].name] = list[i].value; } } return onejson; }, //获取表单数据Array [{"name":"ftopicno","value":""},{"name":"ftopicname","value":""}] Get_FormArray: function () { var list = this.serializeArray(); var $radio = $('input[type=radio],input[type=checkbox]', this); var temp = {}; $.each($radio, function () { if (!temp.hasOwnProperty(this.name)) { if ($("input[name='" + this.name + "']:checked").length == 0) { temp[this.name] = ""; list.push({ name: this.name, value: "" }); } } }); var disabledlist = $('input[disabled=disabled]', this); for (var i = 0; i < disabledlist.length; i++) { list.push({ name: disabledlist[i].name, value: disabledlist[i].value }); } for (var i = 0; i < list.length; i++) { if (list[i].value == "" || list[i].value == "null" || list[i].value == "undefined" || list[i].value == null || list[i].value == undefined) { list[i].value = null; } } return list; }, //获取表单数据 ftopicno=&ftopicname=&supnamecn=&createtime_strat= 中间‖隔开2个表单 Get_Form_List: function () { var formlist = this; var strlist = ""; for (var i = 0; i < formlist.length; i++) { var list = $("#" + formlist[i].id).serializeArray(); var $radio = $('input[type=radio],input[type=checkbox]', this); var temp = {}; $.each($radio, function () { if (!temp.hasOwnProperty(this.name)) { if ($("input[name='" + this.name + "']:checked").length == 0) { temp[this.name] = ""; list.push({ name: this.name, value: "" }); } } }); var disabledlist = $('input[disabled=disabled]', this); for (var j = 0; j < disabledlist.length; j++) { list.push({ name: disabledlist[j].name, value: disabledlist[j].value }); } if (strlist == "") { strlist = jQuery.param(list); } else { strlist += "‖" + jQuery.param(list); } } return strlist; }, //获取表单数据Get_FormOneArray_List {"name":"ftopicno","value":"","value":""} Get_FormOneArray_List: function () { var formlist = this; var templist = []; for (var i = 0; i < formlist.length; i++) { var list = $("#" + formlist[i].id).serializeArray(); var $radio = $('input[type=radio],input[type=checkbox]', this); var temp = {}; $.each($radio, function () { if (!temp.hasOwnProperty(this.name)) { if ($("input[name='" + this.name + "']:checked").length == 0) { temp[this.name] = ""; list.push({ name: this.name, value: "" }); } } }); var disabledlist = $('input[disabled=disabled]', this); for (var j = 0; j < disabledlist.length; j++) { list.push({ name: disabledlist[j].name, value: disabledlist[j].value }); } var onejson = {}; for (var k = 0; k < list.length; k++) { if (list[k].value == "" || list[k].value == "null" || list[k].value == "undefined" || list[k].value == null || list[k].value == undefined) { onejson[list[k].name] = null; } else { onejson[list[k].name] = list[k].value; } } templist.push(onejson); } return templist; }, //重置表单包含 redio和checkbox ReSet: function () { this[0].reset(); var $list = $('input[type=radio],input[type=checkbox]', this); var temp = {}; $.each($list, function () { if (!temp.hasOwnProperty(this.name)) { $("input[name='" + this.name + "']:checked").prop('checked', ''); } }); var $hiddenlist = $('input[type=hidden]', this); var hiddentemp = {}; var selector = this.selector; $.each($hiddenlist, function () { if (!hiddentemp.hasOwnProperty(this.name)) { $(selector + " input[name='" + this.name + "']").val(''); } }); } }); //获取时间 根据上前时间月日加减方法 function today(type, operator, value) { var today = new Date(); switch (type) { case "m": if (operator == "-") { today.setMonth(today.getMonth() - parseInt(value)); } else if (operator == "+") { today.setMonth(today.getMonth() + parseInt(value)); } break; case "d": if (operator == "-") { today.setDate(today.getDate() - parseInt(value)); } else if (operator == "+") { today.setDate(today.getDate() + parseInt(value)); } break; } var h = today.getFullYear(); var m = today.getMonth() + 1; var d = today.getDate(); m = m < 10 ? "0" + m : m; // 这里判断月份是否<10,如果是在月份前面加'0' d = d < 10 ? "0" + d : d; // 这里判断日期是否<10,如果是在日期前面加'0' return h + "-" + m + "-" + d; } })(jQuery)
使用详解:
$("#tab1_form").Set_Form({ jsonValue: json, isDebug: false });
var json={ jsonValue: json, isDebug: false };
$("#tab1_form").Set_Form(json);
欢迎分享,(联系QQ/微信:282625252)