Ciao a tutti,
genero dinamicamente un form impaginato in una tabella html con righe e colonne.
ogni riga ha un campo quantita con un suo id univoco "qta_1 per la prima riga, qta_2 per la seconda ecc." e un contenitore span con id univo per il costo "costo_1 per la prima riga, costo_2 per la seconda ecc.
devo gestire l'evento cambia sul campo quantita e aggiornare il prezzo.
faccio così ma non è soddisfacente:
function aggiorna(qta_id, prezzo)
{
var theEvent = window.event;
var key = theEvent.keyCode || theEvent.which;
key = String.fromCharCode( key );
var regex = /[0-9]|\./;
if( !regex.test(key) )
{
key="";
theEvent.returnValue = false;
theEvent.preventDefault();
}
var ref = document.getElementById(qta_id);
var quantita = ref.value+key;
var a = qta_id.split("_");
var id = a[1];
$('#costo_'+id).text(prezzo*quantita);
}
sul campo quantita aggiungo l'evento così:
<input type="text" name="qta_1" id="qta_1" value="1" onkeypress="aggiorna('qta_1',10.5);"></td><td><span id="costo_1">23.95</span>
il tutto funziona ma:
1) se gestisco l'evento onchange al posto di onkeypress ho l'aggiornamento solo quando esco dal campo mentre io lo vorrei immediato
2) la mia funzione non sente il tasto backspace quindi se cancello una cifra non aggiorna
3) se seleziono la cifra della quantità e la modifico con altro numero ho un risultato inatteso
qualcuno che ha già affrontato questo punto potrebbe indicarmi la strada corretta da percorrere?
grazie