Jquery obtains the form Content and binds data to the form. jqueryform
In the process of daily development, we will inevitably use form forms. We need to obtain the form data and save it to the database, or get a string of json data in the background, to bind data to the form, I wrote a jquery-based formHelp plug-in, which is also easy to use:
Get the data of the form: $ ("# formid"). serializeJson ();
Bind data to the form: $ ("# formid"). setForm (json );
Jquery. formHelp. js plugin
/*** Serialize the content in form into json * The same checkbox is spliced with a semicolon * @ param {dom} specified selector * @ param {obj} needs to be spliced in the following json object * @ method serializeJson **/$. fn. serializeJson = function (otherString) {var serializeObj ={}, array = this. serializeArray (); $ (array ). each (function () {if (serializeObj [this. name]) {serializeObj [this. name] + = ';' + this. value;} else {serializeObj [this. name] = this. value ;}}); if (otherString! = Undefined) {var otherArray = otherString. split (';'); $ (otherArray ). each (function () {var otherSplitArray = this. split (':'); serializeObj [otherSplitArray [0] = otherSplitArray [1] ;});} return serializeObj ;}; /*** assign the josn object to the json object * @ param {dom} specified by form * @ param {obj} to be assigned to form * @ method serializeJson **/$. fn. setForm = function (jsonValue) {var obj = this; $. each (jsonValue, function (name, ival) {var $ Oinput = obj. find ("input [name =" + name + "]"); if ($ oinput. attr ("type") = "checkbox") {if (ival! = Null) {var checkboxObj = $ ("[name =" + name + "]"); var checkArray = ival. split (";"); for (var I = 0; I <checkboxObj. length; I ++) {for (var j = 0; j <checkArray. length; j ++) {if (checkboxObj [I]. value = checkArray [j]) {checkboxObj [I]. click () ;}}} else if ($ oinput. attr ("type") = "radio") {$ oinput. each (function () {var radioObj = $ ("[name =" + name + "]"); for (var I = 0; I <radioObj. length; I ++) {if (radioObj [I]. value = ival) {radioObj [I]. click () ;}}) ;}else if ($ oinput. attr ("type") = "textarea") {obj. find ("[name =" + name + "]" 2.16.html (ival);} else {obj. find ("[name =" + name + "]"). val (ival );}})}
Html test code
<! DOCTYPE html>
Links to other recommended articles:
JavaScript Pattern Design
JavaScript Pattern Design-Singleton pattern
JavaScript Pattern Design: constructor Pattern
Builder mode for JavaScript Pattern Design
Factory mode of JavaScript Pattern Design
Proxy mode for JavaScript Pattern Design
JavaScript Pattern Design-Command pattern