jQuery ajax - serializeArray() विधा

jQuery Ajax संदर्भ हान्डबुक

उदाहरण

फॉर्म मूल्य को सरिजलाइज करके एक एक्सएस (एक एक्सएस) के रूप में उत्प्रेरित करने का परिणाम आउटपुट करें:

$("button").click(function(){
  x=$("form").serializeArray();
  $.each(x, function(i, field){
    $("#results").append(field.name + ":" + field.value + " ");
  });
});

स्वयं प्रयोग करें

विभावना और उपयोग

serializeArray() विधा फॉर्म मूल्य को अनुक्रमित करके ऑब्जेक्ट एलिमेंट (नाम और मूल्य) का एक एलिमेंट एक्सएस (एक ऑब्जेक्ट एलिमेंट एक्सएस) बनाती है।

आप एक या अनेक फॉर्म एलिमेंट (जैसे input और/या textarea) या form एलिमेंट स्वयं को चयन कर सकते हैं।

व्याकरण

$(चयनकर्ता).serializeArray()

विस्तृत वर्णन

serializeArray() विधा फॉर्म एलिमेंट (जैसे .serialize() विधा），JSON डाटा संरचना वापस देती है।

ध्यान दें:यह विधा JSON ऑब्जेक्ट वापस देती है, न कि JSON स्ट्रिंग। इसे स्ट्रिंगीकरण करने के लिए प्लगइन या तीसरे पक्ष की लाइब्रेरी की आवश्यकता होती है।

वापसी वाला JSON ऑब्जेक्ट एक ऑब्जेक्ट एलिमेंट एक्सएस (एक ऑब्जेक्ट एलिमेंट एक्सएस) से बना होता है, जिसमें प्रत्येक ऑब्जेक्ट में एक या दो नाम-मूल्य जोड़े होते हैं - name पैरामीट और value पैरामीट (यदि value खाली नहीं है)। उदाहरण के लिए:

[ 
  {name: 'firstname', value: 'Hello'}, 
  {name: 'lastname', value: 'World'},
  {name: 'alias'}, // मूल्य खाली
]

.serializeArray() विधा W3C के बारे में सफल नियंत्रकसामान्य नियंत्रकों के मानक के अनुसार के आधार पर जांच करती है कि कौन-से एलिमेंट शामिल किए जाने चाहिए। विशेष रूप से, एलिमेंट निष्क्रिय नहीं होना चाहिए (निष्क्रिय एलिमेंट शामिल नहीं होते हैं) और एलिमेंट को name अटिबात रखना चाहिए। सबमिट बटन के मूल्य नहीं अनुक्रमित होते हैं। फाइल चयन एलिमेंट के डाटा नहीं अनुक्रमित होते हैं।

यह विधा अलग चयनित फॉर्म एलिमेंट के अब्जेक्ट पर कार्य कर सकती है, जैसे <input>, <textarea>, और <select>। लेकिन, अधिक सुविधाजनक विधा, <form> टैग स्वयं को चयन करने के लिए डायरेक्ट रूप से अनुक्रमण करना है। 

$("form").submit(function() {
  console.log($(this).serializeArray());
  return false;
});

ऊपरी कोड से नीचे का डाटा संरचना उत्पन्न होता है (अगर ब्राउज़र console.log समर्थन करता है):

[
  {
    name: a
    value: 1
  },
  {
    name: b
    value: 2
  },
  {
    name: c
    value: 3
  },
  {
    name: d
    value: 4
  },
  {
    name: e
    value: 5
  }
]

मिसाल

फॉर्म की सामग्री प्राप्त करें और वेब पृष्ठ में जोड़ें:

HTML 代码：

<p id="results"><b>Results:</b> </p>
<form>
  <select name="single">
    <option>Single</option>
    <option>Single2</option>
  </select>
  <select name="multiple" multiple="multiple">
    <option selected="selected">Multiple</option>
    <option>Multiple2</option>
    <option selected="selected">Multiple3</option>
  </select><br/>
  <input type="checkbox" name="check" value="check1"/> check1
  <input type="checkbox" name="check" value="check2" checked="checked"/> check2
  <input type="radio" name="radio" value="radio1" checked="checked"/> radio1
  <input type="radio" name="radio" value="radio2"/> radio2
</form>

jQuery 代码：

var fields = $("select, :radio").serializeArray();
jQuery.each( fields, function(i, field){
  $("#results").append(field.value + " ");
});

jQuery Ajax संदर्भ हान्डबुक