Jquery:associazione eventi a righe dinamiche

[antony85]

Salve a tutti, ho il seguente problema:
In un form html, ho una tabella, dove tramite 1 pulsante, inserisco dinamicamente le righe, una per volta.
Una riga contiene 3 <input area="text">: Prezzo, Quantita, Valore totale.
Vorrei che, una volta inserito prezzo e quantità, magicamente valore totale conterrà il prodotto tra questi 2.
Ho programmato in questo modo: tramite un indice contatore, assegno gli id ad ogni textare, e imposto il relativo listener. Non so perchè, ma il listener sembra non agganciarsi.
La function è la seguente:
var i=1;
function add_row()
{
var s="<tr id='rigo"+i+"'>"
+"<td><input type='text' style='width: 100%' name='desc["+i+"]' value='"+i+"'></td>"
+"<td><input type='text' style='width: 100%' name='qta["+i+"]' id='qta"+i+"'></td>"
+"<td><input type='text' style='width: 100%' name='costo["+i+"]' id='costo"+i+"'></td>"
+"<td><input type='text' style='width: 100%' name='prezzo["+i+"]' id='prezzo"+i+"'></td>"
+"</tr>";

$('#merce').append(s);
$('#costo'+i+'').blur(function()
{
$('#prezzo'+i+'').val($('#qta'+i+'').val()*$('#cos to'+i+'').val());
});
i++;
}

[lucavizzi]

$('.classe').live('blur',function(){
...
});

[antony85]

Utile live, permette di definire listener di eventi, a elementi che non sono ancora stati inseriti o generati nella pagina. Ma credo serva qualcosa di piu:
Il problema che ho notato, mettendo nomi di selettori dinamici($('#op2'+i)) dove i si incrementa ogni volta che l'utente clicca sul pusalnte "aggiungi", è che jquery "dimenticasse" i listener precedenti, oppure come se "cambiasse" i vecchi listener(che dovrebbero essere fissi su un certo valore di i) al nuovo valore di i, stravolgendo quindi tutto il programma. Come potrei risolvere? Anche se utilizzassi un array al posto di una variabile semplice, dovrei riferirmi sempre alle celle dell'array con una variabile indice i, che cambiando, ogni volta anche i risultati precedenti, mi darebbe sempre lo stesso errore...Cosa suggerite?

[cavicchiandrea]

Originariamente inviato da antony85
... Il problema che ho notato, mettendo nomi di selettori dinamici($('#op2'+i)) dove i si incrementa ogni volta che l'utente clicca sul pusalnte "aggiungi", è che jquery "dimenticasse" i listener precedenti, oppure come se "cambiasse" i vecchi listener

Se aggiungi un elemento non "dimentica" nulla, non può dimenticare un qualcosa che non esiste, se lo "modifichi" pertanto lo sovrascrivi allora si

[antony85]

Posto un po di codice, utilizzando il metodo live...continua a non funzionare comunque...e non capisco dov'è l'errore...
Su 3 textbox inserite in una tabella con id "merce", ogni volta che l'utente inserisce un numero in una delle prime 2 textbox, jquery fa il prodotto tra questi due operandi, inserendolo nella terza textbox. Le righe (e quindi anche gli id) sono create dinamicamente tramite pulsante, che richiama la function add_row();

<table id="merce" style="border: 1px solid black;width: 430px">
<tr>
<td colspan="3"><input type="button" onclick="javascript:add_row()" value="Aggiungi Rigo"></td>
</tr>
<tr>
<td>Op1</td>
<td>Op2</td>
<td>Prodotto</td>
</tr>
</table>

<script>
var i=1
function add_row()
{
var s="<tr id='rigo"+i+"'>"
+"<td><input type='text' id='op1"+i+"'></td>"
+"<td><input type='text' id='op2"+i+"'></td>"
+"<td><input type='text' id='out"+i+"'></td>"
+"</tr>";

$('#op2'+i).live('keyup',function()
{
$('#out'+i).val($('#op1'+i).val()*$('#op2'+i).val( ));
});
$('#op1'+i).live('keyup',function()
{
$('#out'+i).val($('#op1['+i).val()*$('#op2['+i).val());
});
$('#merce').append(s);
i++;
}
</script>

[cavicchiandrea]

Trovo le tabelle più complesse da "generare" prova con i div, oltretutto dovresti appendere la riga generata all'ultimo elemento <tr> non alla tabella