PDA

View Full Version : [HTML + JS] Aggiungere dinamicamente righe ad una tabella


VegetaSSJ5
10-12-2007, 19:09
Salve a tutti! Devo fare una cosina in html + javascript, ma non avendo in pratica mai fatto nulla di serio non so come andare avanti.

Ho una tabella con diverse righe di 2 celle ciascuna. Una riga (quasi al centro delle N righe) è la seguente:

<tr>
<td class="field_name">Privato o azienda?</td>
<td>Privato <input value="PRIVATO" name="privatoazienda" checked="checked" type="radio" onchange="javascript: disable_AZIENDA();" />&nbsp;&nbsp;Azienda <input value="AZIENDA" name="privatoazienda" type="radio" onchange="javascript: enable_AZIENDA();" /></td>
</tr>

Vorrei che quando viene selezionato il radio button "Azienda" (e quindi parte la funzione javascript enable_AZIENDA() ) si aggiungano automaticamente alla tabella (non in fondo alla tabella, ma dopo la riga Privato/Azienda) altre righe, del tipo Partita iva, indirizzo di fatturazione ecc...

Come posso fare?
Confido nella vostra esperienza e pazienza... :D

kk3z
10-12-2007, 21:02
Aggiungi i campi nell'html, assegna un id alla riga o alla cella (tr o td) che contiene i campi, e mostra/nascondi a seconda del campo selezionato:

<script type="text/javascript">
function EnableDisableAzienda(radio)
{
var dati_azienda = document.getElementById("dati_azienda");
if (radio.checked)
{
if (radio.value== "AZIENDA")
dati_azienda.style.display = "";
else if (radio.value== "PRIVATO")
dati_azienda.style.display = "none";
}
}
</script>
<table>
<tr>
<td class="field_name">Privato o azienda?</td>
<td>Privato <input value="PRIVATO" name="privatoazienda" checked="checked" type="radio" onclick="EnableDisableAzienda(this)" />&nbsp;&nbsp;Azienda <input value="AZIENDA" name="privatoazienda" type="radio" onclick="EnableDisableAzienda(this)" /></td>
</tr>
<tr id="dati_azienda">
<td>
<table>
<tr>
<td>Campo 1:</td>
<td><input type="text" name="ciao"</td>
</tr>
</td>
</tr>

VegetaSSJ5
10-12-2007, 23:49
grazie 1000! :)
cercavo proprio una cosa tipo "display". domani provo e fo sapere! ;)

VegetaSSJ5
14-12-2007, 13:19
scusa ma in questi giorni non ho avuto modo di provare... appena fatto e effettivamente funziona! ;)

ora... siccome le righe che dovranno apparire/scomparire in base alla selezione del radio button sono più di una avevo intenzione di fare una cosa del genere:<tr id="dati_azienda">
<td>Campo 1:</td>
<td><input type="text" name="input1"</td>
</tr>
<tr id="dati_azienda">
<td>Campo 2:</td>
<td><input type="text" name="input2"</td>
</tr>
...
...
cioè voglio identificare tutte le righe che devono apparire/sparire con lo stesso identificatore, quindi nel codice javascript vorrei utilizzare una funzione del tipo RIGHE_DA FAR_SCOMPARIRE= getElementsBy...(dati_azienda) che mi ritorna una lista di elementi che posso far scomparire con un ciclo

for (i=0; i< RIGHE_DA_FAR_SCOMPARIRE.length; i++)
RIGHE_DA_FAR_SCOMPARIRE[i].style.display= "none";

ma non so che metodo js utilizzare per fare ciò... :help:

amedeoviscido
14-12-2007, 13:57
Aggiungi i campi nell'html, assegna un id alla riga o alla cella (tr o td) che contiene i campi, e mostra/nascondi a seconda del campo selezionato:

<script type="text/javascript">
function EnableDisableAzienda(radio)
{
var dati_azienda = document.getElementById("dati_azienda");
if (radio.checked)
{
if (radio.value== "AZIENDA")
dati_azienda.style.display = "";
else if (radio.value== "PRIVATO")
dati_azienda.style.display = "none";
}
}
</script>
<table>
<tr>
<td class="field_name">Privato o azienda?</td>
<td>Privato <input value="PRIVATO" name="privatoazienda" checked="checked" type="radio" onclick="EnableDisableAzienda(this)" />&nbsp;&nbsp;Azienda <input value="AZIENDA" name="privatoazienda" type="radio" onclick="EnableDisableAzienda(this)" /></td>
</tr>
<tr id="dati_azienda">
<td>
<table>
<tr>
<td>Campo 1:</td>
<td><input type="text" name="ciao"</td>
</tr>
</td>
</tr>

Codice molto interessante, me lo sono copiato :D