oujood.com

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

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

chercher |

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.

Exemple :       Copier le code

<!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 :

Exemple :       Copier 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>
Par gerywa 25 juillet 2014



Voir aussi nos tutoriel :

fonction str_ireplace, str_ireplace

Version insensible la casse de str_replace

fonction ltrim

Supprime les espaces (ou d'autres caractères) de d but de chaîne

La fonction rtrim, rtrim

Supprime les espaces (ou d'autres caractères) de fin de chaîne