Creare dinamicamente elementi in una pagina e passarli via form

[wwebm]

Ciao,
è possibile creare elementi html dinamicamente e poi passarne i valori tramite un form via POST?

Ad esempio vorrei creare un pulsante attraverso il quale aggiungere delle textbox in un form.
All'evento submit vorrei poi prendere i valori in tutte le textbox e unirli in un unica stringa e inviarli quindi tramite POST.

Se si mi potete aiutare?
Grazie.

[artorius]

certo, basta che aggiungi l'elemento all'interno della form e al submit viene inviato come un elemento normale (dal punto di vista del browser è un elemento normale).

Ti faccio un esempio con una table:

Codice HTML

<form action=".." method="post">
<table>
   <thead>
      <tr>
         <th>Nome</th>
         <th>Cognome</th>
         <th>Indirizzo</th>
         <th>Citt&agrave;</th>
         <th>Aggiungi Riga</th>
      </tr>
   </thead>
   <tbody id="MyContent">
      
   </tbody>
</table>
</form>



   Vuota tabella
</p>

Ho messo il thead ed il tbody perché potrei essere interessato a cancellare il contenuto della tabella, ma l'intestazione la devo tenere, compreso il link per aggiungere righe.

Codice JS

//Crea una riga le celle e gli input all'interno, e poi l'aggiunge al tbody
var addRowToTbody = function(){
   //Ottengo l'elemento tbody
   var tbody = document.getElementById("MyContent");
   //Creo un elemento tr
   var tr = document.createElement("tr");
   //l'aggiungo al tbody
   tbody.appendChild(tr);
  
   //Continuo con gli altri elementi
   var td = document.createElement('td');
   tr.appendChild(td);
   var inpt = document.createElement('input');
   td.appendChild(inpt);
   //Setto i dati dell'input
   inpt.type = "text";
   //Se sei pratico di PHP o ASP (credo lo supporti) non dovresti avere problemi a capire
   inpt.name = "name[]";

   //Gli altri campi	
   td = document.createElement('td');
   tr.appendChild(td);
   inpt = document.createElement('input');
   td.appendChild(inpt);
   inpt.type = "text";
   inpt.name = "lastname[]";

   td = document.createElement('td');
   tr.appendChild(td);
   inpt = document.createElement('input');
   td.appendChild(inpt);
   inpt.type = "text";
   inpt.name = "address[]";

   td = document.createElement('td');
   tr.appendChild(td);
   inpt = document.createElement('input');
   td.appendChild(inpt);
   inpt.type = "text";
   inpt.name = "city[]";

   td = document.createElement('td');
   tr.appendChild(td);
   var a = document.createElement('a');
   td.appendChild(a);
   a.href = '#';
   a.onclick = deleteRowFromTbody;
   a.appendChild(document.createTextNode('Cancella'));
}

//Cancella la riga corrispondente al link Cancella cliccato
var deleteRowFromTbody = function(){
   //Ottengo il tr dal link
   var tr = this.parentNode.parentNode;
   //Lo cancello
   tr.parentNode.removeChild(tr);
}

//Cancella il tbody creando un altro elemento tbody e sostituendolo
var emptyTbody = function(){
   var tbody = document.getElementById("MyContent");
   var newTbody = document.createElement("tbody");
   tbody.parentNode.replaceChild(newTbody, tbody);
   newTbody.id = "MyContent";
}

//Associo le funzioni ai link
window.onload = function(){
	document.getElementById("Adder").onclick = addRowToTbody;
	document.getElementById("Empty").onclick = emptyTbody;
}

[wwebm]

Però i dati li dovrei prendere in php dal POST del form...

Forse basta fare come hanno fatto qui credo...
http://forum.html.it/forum/showthrea...=&pagenumber=3

Grazie!

[artorius]

allora, mi sa che non ti sei spiegato bene: Di Cosa Hai Bisogno?

[wwebm]

Allora devo poter aggiungere delle textbox nella pagina dinamicamente...ad esempio se mi servono due caselle di testo ci sarà un pulsante che ne aggiunge una in modo da scriverci dentro.

Al click poi su submit devo essere rimandato ad una pagina php che deve leggere questi dati nelle textbox.

Grazie ancora.

[artorius]

e quello che ti ho passato fa esattamente questo

[wwebm]

Poi però come faccio a vedere quanti parametri ho in php?

Grazie ancora.

[artorius]

Pensavo conoscessi questa feature di PHP:

mettendo ad una serie di input il nome address[] al submit otterai una variabile PHP:

$_POST[address] che conterrà un array con i value inseriti negli input, ed indice l'ordine in cui sono inseriti nella form, a partire da 0.

Quindi

<input name="address[]" value="gigi" type="text" />
<input name="address[]" value="pippo" type="text" />
<input name="address[]" value="cocco" type="text" />
<input name="address[]" value="lullo" type="text" />

al submit nel file PHP ottieni:

$_POST[address] = array("gigi", "pippo", "cocco", "lullo");

[wwebm]

Cavolo!
E se poi da php voglio sapere anticipatamente quanti record ho nell'array, per fare un ciclo che scorre tutto l'array come devo fare?
C'è un metodo che mi ritorna il numero di record dell'array?

Ancora grazie.

[artorius]

Ma allora sei proprio alle basi di PHP... gli array sono una delle cose più importanti da sapere:

array() : crea un array, è possibile passagli gli elementi in una lista di argomenti sia come solo valori o come copia di chiave => valore. Es. array("pippo", "pluto"); ==>> [0] => 'pippo', [1] => 'pluto' o array('key1' => 'value1', 'key2' => 'value2') ==>> [key1] => 'value1', [key2] => 'value2'

count($mixedvar): ritorna il numero di elementi all'intero di un array. Es. count(array('pippo', 'pluto')) == 2

foreach(): scorre un'array valore per valore, la sintassi è:
foreach($array as $value){
/*Qui cicla n volte, dove n è il count($array), ad ogni ciclo i (con i = [0..n-1]) $value è un valore dell'array in posizione i*/
}
foreach($array as $key => $value){
/*Qui cicla n volte, dove n è il valore di count($array), ad ogni ciclo i (con i = [0..n-1]) $value è un valore dell'array in posizione i e $key è la sua chiave corrispondente*/
}