web-dev-qa-db-fra.com

Comment obtenir un tableau avec jQuery, plusieurs <input> avec le même nom

J'ai un formulaire où les utilisateurs peuvent ajouter des champs de saisie avec jQuery.

<input type="text" id="task" name="task[]" />

Après avoir envoyé le formulaire, je reçois un tableau en PHP.

Je veux gérer ceci avec la $.ajax() mais je ne sais pas comment transformer mon <input>s en un tableau dans jQuery.

Merci d'avance.

59
x4tje

Utiliser map :

var values = $("input[id='task']")
              .map(function(){return $(this).val();}).get();

Si vous modifiez ou supprimez l'id (qui doit être unique), vous pouvez également utiliser le sélecteur $("input[name='task\\[\\]']")

Exemple de travail: http://jsbin.com/ixeze3

113
Kobi

Pour plusieurs éléments, vous devriez lui donner une classe plutôt que son id, par exemple:

<input type="text" class="task" name="task[]" />

Maintenant, vous pouvez obtenir ceux qui utilisent jQuery quelque chose comme ceci:

$('.task').each(function(){
   alert($(this).val());
});
32
Sarfraz

Premièrement, vous ne devriez pas avoir plusieurs éléments avec le même identifiant sur une page, un identifiant unique.

Vous pouvez simplement supprimer l'attribut id et le remplacer par:

<input type='text' name='task'>

et pour obtenir un tableau des valeurs de tâche do

var taskArray = new Array();
$("input[name=task]").each(function() {
   taskArray.Push($(this).val());
});
15
Dal Hundal

Pour attraper le tableau de noms, je l’utilise:

$("input[name*='task']")
9
fxs

Vous ne pouvez pas utiliser le même identifiant pour plusieurs éléments d'un document. Conservez les identifiants différents et nommez les mêmes pour les éléments.

<input type="text" id="task1" name="task" />
<input type="text" id="task2" name="task" />
<input type="text" id="task3" name="task" />
<input type="text" id="task4" name="task" />
<input type="text" id="task5" name="task" />

var newArray = new Array();

$("input:text[name=task]").each(function(){
    newArray.Push($(this));
});
6
rahul

HTML:

<input type="text" name="task[]" class="form-control" id="task">

JS:

var tasks= new Array();
$('input[name^="task"]').each(function() 
{
tasks.Push($(this).val());
});
1
Antonio Reyes

si vous voulez que le sélecteur obtienne le même identifiant, utilisez:

$("[id=task]:eq(0)").val();
$("[id=task]:eq(1)").val();
etc...
0
wade

Vous pouvez utiliser jquery.serializeJSON pour le faire.

0
Nikola Obreshkov