[JS]Proprietà innerHtml su una tabella

[softoxy]

Voglio costriure una tabella dinamicamente, ovvero inserire le righe senza perdere l'allineamento.

se uso un div, questo non permette di scrivere all'interno:

<table>
<tr><td>Y</td></tr>
<div id="pippo">
<tr><td>X</td></tr>
</div>
</table>

js: document.getElementById("pippo").innerHtml = "<tr><td>H</td></tr>"

se uso invece <tbody> explorer 7 fa capricci, mi da un errore in runtime

<table>
<tr><td>Y</td></tr>
<tbody id="pippo">
<tr><td>X</td></tr>
</tbody>
</table>

js: document.getElementById("pippo").innerHtml = "<tr><td>H</td></tr>"

Ma non c'è un modo per scrivere una tabella in maniera dinamica?
Uso tag sbagliati per scrivere all'interno di una tabella?

Un esempio potrebbe essere una rubrica in cui i contatti crescono alla pressione di un pulsante, inserendo cioè una nuova riga nella tabella.

Grazie.

[softoxy]

help me!

[lake86]

la struttura di una table è

<table>
<tbody>
<tr>
<td>

nessuna di quelle descritte da te e valida.
I div se li vuoi devi metterli dentro i <td></td>

E' obblico usare

document.getElementById("pippo").innerHtml += "<tr><td>H</td></tr>"

non

document.getElementById("pippo").innerHtml = "<tr><td>H</td></tr>"

se no sovrascrivi il sontentuto e non va + nulla

[softoxy]

Grazie per la risposta.
Ma è indiffernte ai fini del risultato se uso += o =, perchè tanto con il div all'interno della table che sta fuori i <td>, l'innerHtml non scrive nulla.

Forse sbaglio altro.......

[andr3a]

Originariamente inviato da softoxy
tanto con il div all'interno della table che sta fuori i <td>, l'innerHtml non scrive nulla.

e su questo ti ha già risposto ... non esistono DIV fuori dai TD ... la tabella è

il divo o lo metti dentro i TD o fuori da tutta la tabella ...

Originariamente inviato da softoxy
Forse sbaglio altro.......

può darsi ma intanto scrivi il layout in modo corretto

[softoxy]

Ah, ok, non avevo ben capito allora.
Il problema rimane. Devo poter cambiare il contenuto della tabella dinamicamente, lasciando però l'allineamento.

<table>
<thead><tr><td>nome colonna</td></tr><thead>
<tbody id="X"><tr><td>conenuto</td></tr></tbody>
</table>

scrivendo document.getElementById("X").innerHtml += o = "<tr><td>conenuto2</td></tr>"

su explorer mi da un errore: errore in run-time sconosciuto.
Non c'è qualche altro tag che mi permette di scrivere nella tabella senza perdere l'allineamento?
In sostanza vorrei poter scrivere un datagrid, in cui la label delle colonne rimane fissa, mentre una scrollbar sulla destra scorre gli elementi del datagrid, nel caso quest'ultimi superino le dimensioni fissati del datagrid.
Non c'è qualcosa di già fatto?

[lake86]

Per aggiornare il contenuto di una table senza modificarne la struttura si puo fare in alcuni modi differenti....
io solotamente uso

var tbl = document.getElementById('idtabella');
var r = tbl.insertRow(tbl.raws.length);
var c = r. insertCell(0).innerHTML = 'valore cella';
c.className= 'ciao'
var c = r. insertCell(1).innerHTML = 'valore cella1'; 

ciao

[Xinod]

Originariamente inviato da lake86
var r = tbl.insertRow(tbl.rows.length);

[softoxy]

Funziona perfettamente, grazie mille, oltretutto ho trovato anche questo link molto utile:

http://www.mredkj.com/tutorials/tableaddrow.html

Non sarà possibile limitare la dimensione della table con qualche altro componente vero?Intendo con la scrollbar a destra che scrolla le righe, ma non l'header della tabella......

adesso voglio provarlo caricando i dati da un server remoto con la funzione XMLHttpRequest()...

[lake86]

Originariamente inviato da Xinod

Originariamente inviato da lake86
var r = tbl.insertRow(tbl.rows.length);

errore di digitazione :P

Grazie della correzione

carino lo script che hai trovato :P Studialo che non avrai + problemi con le table