JQuery-SerializeObject based on Serializearray

Serializing a form into a JSON object

[JavaScript] View Plain Copy Print ?

2. jquery.prototype.serializeobject= function (){  
4. var obj= New  Object ();
6. $.each (this. Serializearray (),function(index,param) {
8. if (!( Param.name in obj) {
10. Obj[param.name]=param.value;
12. }
14. });
16. return  obj;
18. };

Jquery.prototype.serializeobject=function () {var obj=new Object (); $.each (This.serializearray (), function (index, param) {if (!) ( Param.name in obj) {obj[param.name]=param.value;}}); return obj;};

With Username,password two input in form, see effect

$ ("form"). Serializearray ()

[{"Name": "username", "value": "" "},{" name ":" Password "," Value ":" "}]

$ ("form"). SerializeObject ()
{"username": "", "Password": ""}

SerializeObject only for cases where the name value is not duplicated, and if the name value is repeated, take the first

20150125 Update
===========

+ This version is no longer compatible with IE8
+ Fix A logic error

[JavaScript] View Plain Copy Print ?

2. $.fn.serializeobject= function (){  
4. var  Hasownproperty=object.prototype.hasownproperty;
6. return this. Serializearray (). Reduce (function(data,pair) {
8. if (!hasownproperty.call (data,pair.name)) {
10. Data[pair.name]=pair.value;
12. }
14. return  data;
16. },{});
18. };

Another way to achieve this:

$.fn.serializeobject = function () {
var o = {};
var a = This.serializearray ();
$.each (A, function () {
if (O[this.name]!== undefined) {
if (!o[this.name].push) {
O[this.name] = [O[this.name]];
}
O[this.name].push (This.value | | ‘‘);
} else {
O[this.name] = This.value | | ‘‘;
}
});
return o;
};

In JavaScript, you can use the Type property of a form field, along with the name and Value property, to implement a sequence of forms. Before writing the code, it is important to understand how the browser sends the data to the server during form submission.

• URL-encode the name and value of the form field, using the and (&) partition.
• Disable form fields are not sent.
• Send only the check boxes and radio buttons that are checked.
• Buttons with type "reset" and "button" are not sent.
• A single entry for each selected value in the Multi-select box.
• When you click the Submit button to submit the form, the submission is also sent to the ox; otherwise, the submit button is not sent. Also included are the <input> elements of type "image".
• The value of the <select> element is the value of the values attribute of the selected <option> element. If the <option> element does not have a value attribute, it is the text value of the <option> element.

jQuery.serializeArray() 函数详解

serializeArray()function is used to serialize a set of form elements and encode the contents of the form into a single JavaScript array .

serializeArray()Functions are commonly used to serialize the contents of a form into a JSON object, so that it is encoded in a JSON-formatted string.

The function encapsulates each form control that is available for submission as an object that has the name and Value property, the name of the form control, and the Value property. These object objects are then encapsulated as an array and returned.

The function does not serialize form controls that do not need to be submitted, which is consistent with the regular form submission behavior. For example: a form control that is not in a <form> tag is not committed, a form control without a name attribute is not committed, a form control with the disabled property is not committed, and a form control that is not selected is not committed.

Unlike regular form submissions, a regular form typically submits a button control with name, and the serializeArray() function does not serialize a button control with name. Please click here for more details.

The function belongs to an jQuery object (instance).

Grammar

JQuery 1.2 adds this function.

Jqueryobject . Serializearray ()

return value

serializeArray()The return value of the function is the array type , which returns the JS array after the form element is encoded.

Example & Description

Please refer to the following initial HTML code:

<form name="MyForm" Action="Http://www.365mini.com" Method="POST">
<input name="UID" type="Hidden" value="1" />
<input name="username" type="Text" value="Zhang San" />
<input name="Password" type="Text" value="123456" />
<select name="Grade" ID="Grade">
<option value="1">First Grade</option>
<option value="2">Second Grade</option>
<option value="3" selected="Selected">Third grade</option>
<option value="4">Grade Four</option>
<option value="5">Grade Five</option>
<option value="6">Grade Six</option>
</select>
<input name="Sex" type="Radio" checked="Checked" value="1" />Male
<input name="Sex" type="Radio" value="0" />Female
<input name="Hobby" type="checkbox" checked="Checked" value="1" />Swimming
<input name="Hobby" type="checkbox" checked="Checked" value="2" />Running
<input name="Hobby" type="checkbox" value="3" />Badminton
<input name="BTN" ID="BTN" type="button" value="click" />
</form>

Serialization of the <form> element allows you to serialize all the form elements within it directly.

var=  $("form"). Serializearray ();
/* The following is the contents of the serialized result array Formarray:
[
{name: "UID", Value: "1"},
{Name: "username", Value: "Zhang San"},
{Name: "Password", Value: "123456"},
{Name: "Grade", Value: "3"},
{name: "Sex", Value: "1"},
{Name: "Hobby", Value: "1"},
{Name: "Hobby", Value: "2"}
];
*/

We can also serialize some of the form elements directly.

var=  $(": Text, select,: CheckBox"). Serializearray ();
/* The following is the contents of the serialized results array Result:


{Name: "Password", Value: "123456"},
{Name: "Grade", Value: "3"},
{Name: "Hobby", Value: "1"},
{Name: "Hobby", Value: "2"}
];
*/

JQuery-SerializeObject based on Serializearray