Salve a tutti,

ho scritto un piccolo script che serve a spostare su e giù coppie di elementi di una lista di input box.
Ecco la lista di input box di cui parlo:


I bottoni UP e DOWN che si vedono sono collegati al seguente Javascript e rispettivamente alle funzioni up() e down():

codice:
/* prende la coppia di valori della riga "row" e li sposta su di una posizione poi prende la 
coppia di valori della riga "row-1" e li piazza nella riga "row" */
function up(row){				
	var prev_valore_a = document.getElementById((row-2)*2+1).value;
	var prev_valore_b = document.getElementById((row-1)*2).value;
	document.getElementById((row-2)*2+1).value = document.getElementById(row*2-1).value;
	document.getElementById((row-1)*2).value = document.getElementById(row*2).value;
	document.getElementById(row*2-1).value = prev_valore_a;
	document.getElementById(row*2).value = prev_valore_b;
}

/* duale della funzione up() */
function down(row){
	var next_valore_a = document.getElementById(row*2+1).value;
	var next_valore_b = document.getElementById(row*2+2).value;
	document.getElementById(row*2+1).value = document.getElementById(row*2-1).value;
	document.getElementById(row*2+2).value = document.getElementById(row*2).value;
	document.getElementById(row*2-1).value = next_valore_a;
	document.getElementById(row*2).value = next_valore_b;
}
Quando scrivo valore_a intendo un valore nella prima colonna (es. C, rif. immagine) di input box, mentre con valore_b intendo un valore della seconda colonna di input box (es. CC, rif. immagine).

Il javascript qui sopra funziona perfettamente (nel senso che visivamente fa quello che avevo previsto che facesse) ma ho riscontrato un problema: quando provo questo script con il browser (Firefox nella fattispecie), se visualizzo i sorgenti (CTRL+U) prima e dopo aver spostato una riga qualsiasi con quella sopra (o sotto), sono identici.

ogni riga della tabella che rappresenta appunto l'immagine postata qui sopra, è del seguente tipo (riporto le prime due):
codice:
<input type="text" id="1" name="valore_a1" value="A" size="50"/>
<input type="text" id="2" name="valore_b1" value="AA" size="10"/>
<input type="button" value="UP" disabled="disabled">
<input type="button" value="DOWN" onClick="down(1);">


<input type="text" id="3" name="valore_a2" value="B" size="50"/>
<input type="text" id="4" name="valore_b2" value="BB" size="10"/>
<input type="button" value="UP" onClick="up(2);">
<input type="button" value="DOWN" onClick="down(2);">
Il problema più grave però, è che siccome io uso quella "tabella" all'interno di un FORM per fare una POST e quindi inserire dei dati in un database tramite una JSP, ottengo sempre un NullPointerException, quindi questo javascript fa qualcosa che non dovrebbe fare, ma non riesco a capire cosa.

Di fatto è come se il javascript non rendesse permanenti negli input box, le modifiche visuali che vengono fatte con la pressione dei bottoni

Qualcuno saprebbe darmi qualche indizio? Per caso javascript non è indicato per fare ciò che voglio in questo caso?