2010-04-13 15 views
58

Ho un modulo in cui gli utenti possono aggiungere campi di input con jQuery.Come ottenere un array con jQuery, più <input> con lo stesso nome

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

Dopo aver inviato il modulo, ottengo un array in PHP.

Voglio gestirlo con lo $.ajax() ma non ho idea di come trasformare i miei <input> in un array in jQuery.

Grazie in anticipo.

risposta

109

Utilizzando map:

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

Se si modifica o si rimuove l'id (che dovrebbe essere unico), si può anche utilizzare il selettore $("input[name='task\\[\\]']")

esempio di lavoro: http://jsbin.com/ixeze3

+0

questo funziona bene con 1,2,3 quindi userò questo con la funzione explode di php per ottenerlo ordinato grazie a @all per aiutare – x4tje

+1

@ x4tje - nessun problema. Non devi usare explode - nota che 'values' è un array, non una stringa. Dipende da come fai la tua chiamata AJAX, o ovviamente. – Kobi

+0

perché abbiamo bisogno di '.get()'? – imdhmd

6

Non è possibile utilizzare lo stesso ID per più elementi in un documento. Mantenere gli ID diversi e nominare lo stesso per gli elementi.

<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)); 
}); 
+2

@rahul: che non lo farà, perché ha a che fare con più caselle di testo non uno. Se conosci PHP, nota il nome della casella di testo 'task []' che significa che ci dovrebbero essere più di una casella di testo. – Sarfraz

+2

@rahul: il tuo aggiornamento non aiuta ancora a fare array php che può essere fatto se '[]' è suffisso con il nome del campo. – Sarfraz

31

per più elementi, si dovrebbe dare una classe piuttosto che id esempio:

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

Ora è possibile ottenere quelli che utilizzano jQuery qualcosa di simile:

$('.task').each(function(){ 
    alert($(this).val()); 
}); 
+0

+1 al contatore .. – Anurag

+0

@Anurag: Grazie :) – Sarfraz

+0

+1 Trovo questo più semplice di @Kobi, ma entrambi funzionano bene. –

13

In primo luogo, non si dovrebbe avere più elementi con lo stesso ID in una pagina - L'ID dovrebbe essere unico.

Si potrebbe semplicemente rimuovere l'attributo id ed e sostituirlo con:

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

e per ottenere un array dei valori della compito do

var taskArray = new Array(); 
$("input[name=task]").each(function() { 
    taskArray.push($(this).val()); 
}); 
9

per catturare l'array nomi, io uso che:

$("input[name*='task']") 
+1

Benvenuto nello Stack Overflow..Si prega di leggere la Faq prima di rispondere .. – coder

+0

Questa è in realtà la migliore risposta qui. – timothymarois

0

se si vuole ottenere lo stesso selettore id, uso:

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

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()); 
}); 
Problemi correlati