layout gestito con JS...

[roboro]

Come posso creare una funzione in js che mi gestisca la seguente cosa:

supponendo di avere codice html scritto cosi:

<table width="100%" >
<tr>
<td>1</td>
<td width="100%"><input type="text" name="1" value="{1}"></td>
</tr>
<tr>
<td>2</td>
<td width="100%"><input type="text" name="2" value="{1}"></td>
</tr>
<tr>
<td>3</td>
<td width="100%"><input type="text" name="3" value="{1}"></td>
</tr>
<tr>
<td>4</td>
<td width="100%"><input type="text" name="4" value="{1}"></td>
</tr>
eccc
</table>


Questo codice mi viene generato da un progemma..e nonposso modificarlo, come faccio se

volessimanipolare il layout a io piacimento con js?..
Io vorrei spostare e ottere questo..

<table width="100%" >
<tr>
<td>1</td>
<td width="100%"><input type="text" name="1" value="{1}"></td>

<td>2</td>
<td width="100%"><input type="text" name="2" value="{1}"></td>
</tr>
<tr>
<td>3</td>
<td width="100%"><input type="text" name="3" value="{1}"></td>

<td>4</td>
<td width="100%"><input type="text" name="4" value="{1}"></td>
</tr>
eccc
</table>

inmaniera automatica...

come faccio?

AIUTOOOOOOOOOO

[Mich_]

Quel codice e` un po' obsoleto (formattazioni innestate nel codice HTML anziche` nei CSS), per cui non e` il massimo.

Non e` neppure una bella cosa modificare il codice HTML di una pagina dopo che questa e` stata caricata: qualche browser potrebbe non obbedire.

Comunque JS permette di fare la modifica, ma solo nei browser recenti.

Devi leggere il contenuto della tabella, fare la modifica con una regexp e riscrivere il codice di tutta la tabella.

Esempio (supponendo che nella pagina sia la prima tabella):

var str = document.getElementByTagname('table')[0].innerHTML;
str = str.replace(/(.+?\>1\<.+?)\<\/tr\>.*?\<tr\>(.+?\>2\<.+?)/, "$1$2");
str = str.replace(/(.+?\>3\<.+?)\<\/tr\>.*?\<tr\>(.+?\>4\<.+?)/, "$1$2");
ecc per i vari pezzi da sostituire
document.getElementByTagname('table')[0].innerHTML = str;

[roboro]

io pensavo di non usare le regular exp ma di usare dhtml che permettono di gestire l' html in maniera dinamica...

solo che non so come fare...

saimica la pagina della guida msn su js?..li mi sembra che ci siano dei metodi per farlo...

lo so che non è il max ma sono obbligato...

grazie

[Mich_]

Allora mi devi spiegare cosa e` DHTML.

Io ti ho dato una soluzione, che pur con limitazioni potrebbe funzionare.

Se vuoi usare i CSS, devi impostare il codice HTML che faccia uso di CSS.

Se hai un codice HTML di questo tipo:

<tr class="prima">
<td class="cellas">1</td>
<td class="cellal"><input type="text" name="1" value="{1}"></td>
</tr>
<tr class="seconda">
<td class="cellas">2</td>
<td class="cellal"><input type="text" name="2" value="{1}"></td>
</tr>
<tr class="prima">
<td class="cellas">3</td>
<td class="cellal"><input type="text" name="3" value="{1}"></td>
</tr>
<tr class="seconda">
<td class="cellas">4</td>
<td class="cellal"><input type="text" name="4" value="{1}"></td>
</tr>

allora con un opportuno CSS puoi fare tutto quello che vuoi.

Altrimenti devi per forza andare a modificare il codice HTML, con un metodo del tipo di quello proposto.
Se poi non vuoi usare le Regexp, devi usare qualche altro tipo di parsing, ma ti servono molte piu` istruzioni.

[roboro]

mich e se la tabella non è il primo elemento della pagina?

lo sto provando ma nonmi funziona me lo commenti cosi magari capisco meglio dve sbaglio...

davvero potrei formattare il tutto con un semplice css spostando gli elementi della tabella?...

ma come..bordello...

grazie mille

[roboro]

quello che a me serve è una funzione che mi permetta di gestire questo problema in maniera dinamica, semplicemente passandole il numero di elementii che voglio sulla stessa riga e un campo di riferimento...

ma guarda è un casino allucinante..

VVoVe:

[Mich_]

Quel codice ha un paio di possibili problemi.

Io ho presupposto che la tabella sia la prima della pagina, ma forse se e` l'unica occorre togliere il [0].

Prova comunque a vedere cosa succede con:

alert(document.getElementsByTagname('table')[0].innerHTML.substr(0,10);
alert(document.getElementByTagname('table')[0].innerHTML.substr(0,10);
alert(document.getElementsByTagname('table').inner HTML.substr(0,10);
alert(document.getElementByTagname('table').innerH TML.substr(0,10);

eventualmente prova con getElementsByTagName() o getElementByTagName()
(non ricordo la sintassi esatta, e in questo momento non riesco a verificare).

---

Per accedere ad un elemento ed applicare i CSS occorre uno dei seguenti:
- class (definito dentro il tag)
<td class="nomeclasse">
- id (definito dentro il tag)
<td id="nomeunivoco">
document.getElementById("nomeunivoco")
- getElementsByTagName()[N]

Pero` se hai definito gli elementi di formattazione dentro il tag, non credo che riesci a modificarli tramite i CSS.

Quindi vedi che se riesci ad accedere alla routine che crea il codice HTML la cosa diventa piu` semplice.

[roboro]

grzie provo...