jQuery AJAX la méthode serializeArray()

Définition et Usage la méthode serializeArray()

jQuery cours tutorial

La méthode serializeArray() crée un tableau d'objets (nom et valeur) en sérialisant les valeurs d'un formulaire.

Vous pouvez sélectionner un ou plusieurs éléments de formulaire, ou l'élément formulaire lui-même.
Syntaxe

$(selector).serializeArray()

Exemple Obtenir les valeurs d'un formulaire, effectuer une itération à travers eux et ajouter à un affichage des résultats.


<!DOCTYPE html>
<html>
<head>
   <title>jQuery methode serializeArray </title>
<script type="text/javascript" src="http://ajax.microsoft.com/ajax/jquery/jquery-1.4.2.min.js"></script>
<style>
body, select { font-size:14px; }
form { margin:5px; }
p { color:#f00; margin:5px; }
b { color:#00f; }
</style>
</head>
<body>
<p><b>Resultat:</b> <span id="resultat"></span></p>
<form>
   <select name="Simple">
     <option>Simple</option>
     <option>Simple2</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="coché1" id="ch1"/>
   <label for="ch1">coché1</label>
   <input type="checkbox" name="check" value="coché2" checked="checked" id="ch2"/>
   <label for="ch2">coché2</label>
   <input type="radio" name="radio" value="option1" checked="checked" id="r1"/>
   <label for="r1">option1</label>
   <input type="radio" name="radio" value="option2" id="r2"/>
   <label for="r2">option2</label>
</form>
<script>
   function showValues() {
     var fields = $(":input").serializeArray();
     $("#resultat").empty();
     jQuery.each(fields, function(i, field){
       $("#resultat").append(field.value + " ");
     });
   }
   $(":checkbox, :radio").click(showValues);
   $("select").change(showValues);
   showValues();
</script>
</body>
</html>

Exemple Sortie le résultat de valeurs formulaire sérialisé en tant que tableaux :

Sélectionner le code


<!DOCTYPE   html>
<html>
<head>
   <title>jQuery demo ajax </title>
<script type="text/javascript" src="http://code.jquery.com/jquery-latest.js"></script>
  </script>
<script>
$(document).ready(function(){
 $("button").click(function(){
   x=$("form").serializeArray();
   $.each(x, function(i,
  field){
     $("#results").append(field.name + ":" + field.value
  + " ");
   });
 });
});
</script>
</head>
<body>
<form
  action="">
Nom: <input
  type="text" name="Nom" value="Mickey" /><br />
Prénom:
  <input type="text" name="Prenom"
  value="Mouse" /><br />
</form>
<button>Execute</button>
<div
  id="results"></div>
</body>
</html>

jQuery Liste des méthodes AJAX

Par gerywa 25 juillet 2014

jQuery AJAX la méthode serializeArray() Coder un ensemble d'éléments de formulaire comme un tableau de noms et de valeurs.

Référence jQuery ajax

Définition et Usage la méthode serializeArray()

Exemple Obtenir les valeurs d'un formulaire, effectuer une itération à travers eux et ajouter à un affichage des résultats.

Exemple Sortie le résultat de valeurs formulaire sérialisé en tant que tableaux :

La méthode secrète likes sans fin sur Facebook