$ jQuery ('form') serialize() retourne un seul élément d'une forme sérialisée

Question

Compte tenu de la forme suivante:

<form id="form" name="form"> 
<input name="name"/> 
<input name="version"/> 
<input name="template"/> 
<textarea name="elements"></textarea> 
<textarea name="features"></textarea> 
<textarea name="layout"></textarea> 
<input type="submit" value="Save"/> 
</form> 

et javascript (en utilisant jQuery 1.3.2):

$(function() { 
    $('#form').bind('submit',function() { alert($('#form').serialize()); return false; }); 
    }); 

la sortie de soumettre le formulaire ci-dessus de ce qui précède javascript alerte est:

elements=... 

... Où est ce qui est contenu dans le domaine des éléments.

j'attendre à ce que $ ('# form') serialize() pour retourner un quelque chose comme la chaîne:..

name=&version=&template=&elements=&features=&layout=. 

Je note que $ ('entrée, textarea') sérialisation() ne effectuer le comportement attendu (c.-à-retour "name = & version = & template = & éléments = asdafe & caractéristiques = & layout ="), mais je suis curieux de savoir pourquoi le $ ('# form') Version seulement des retours "elements =". Je l'ai essayé sur Safari 4 et Firefox 3.5, donc je suis sûr que c'est quelque chose qui me manque.

Merci d'avoir lu.

Answer 1

C'est le nom de votre textarea qui le jette.

Voici comment cela se décompose. Dans les DOM, form nœuds ont plusieurs propriétés spéciales, notamment ces deux (qui sont exposés dans cet ordre)

1. Les elements collections, ce qui est un HTMLCollection de tous les contrôles de formulaire (et quelques autres noeuds comme <fieldset> éléments)
2. une propriété de chaque élément nommé sous la forme (par exemple, des contrôles de formulaire qui ont un attribut name)

Puisque vous avez un <textarea> avec le nom des « éléments », ce remplace efficacement le intégrécollectionmentionné dans # 1 ci-dessus, ce qui est la raison pour laquelle lorsque vous sérialiser la forme tout ce que vous voyez est

elements=**** 

Parce que cet élément de formulaire unique a remplacé la collection.

Solution courte? Renommez vos éléments de formulaire en valeurs qui ne sont pas des propriétés DOM existantes (votre <input name="name"/> appartient également à cette catégorie)

Answer 2

La méthode .serializeArray() crée un tableau JavaScript d'objets, prêt à être codé en tant que chaîne JSON. Il fonctionne sur un objet jQuery représentant un ensemble d'éléments de formulaire. Les éléments de formulaire peuvent être de plusieurs types:

Answer 3

Si quelqu'un d'autre trébuche sur ce problème, j'ai défini la propriété disabled sur toutes les entrées avant d'appeler le serialize(), elles n'étaient donc pas incluses dans l'ensemble. La suppression de disabled avant d'appeler le serialize() résout ce problème.