Buongiorno a tutti
dunque, ho una tabella e mi occorre poter eliminare le righe selezionate tramite checkbox utilizzando solo Javascript nativo (no jQuery).
La tabella è semplicissima (in produzione sarà generata dinamicamente)
<table id="elenco" name="elenco">
<thead>
<tr>
<th><input type="checkbox" disabled /></th>
<th>Nome</th>
</tr>
</thead>
<tbody>
<tr id="u_1">
<td><input type="checkbox" name="sel" value="1" /></td>
<td>A</td>
</tr>
<tr id="u_2">
<td><input type="checkbox" name="sel" value="2" /></td>
<td>B</td>
</tr>
<tr id="u_3">
<td><input type="checkbox" name="sel" value="3" /></td>
<td>C</td>
</tr>
<tr id="u_4">
<td><input type="checkbox" name="sel" value="4" /></td>
<td>D</td>
</tr>
</tbody>
</table>
provo a cancellare delle righe ma:
- se cancella una sola riga, tutto OK
- se cancello due righe NON contigue tutto OK (tipo A e C, B e D)
- se cancello due o + righe la seconda selezionata non viene eliminata e rimane selezionata
(se provo a cancellare A e B, A viene eliminata mentre B rimane (selezionata) così come con B e C, C rimane, ecc. ma anche se provo con A, B e C, A e C vengono eliminate mentre B rimane)
Anche se seleziono tutte e 4 le righe, A e C eliminate, B e D rimaste.
Il codice JS è
var els = document.getElementsByTagName('input');
for( i = 0; i < els.length; i++){
if( els[i].getAttribute('type') == 'checkbox' && els[i].checked ) {
var k = els[i].value;
document.getElementById('u_' + k).remove();
}
}
Perchè questo strano comportamento?
Dove sbaglio?
Una pagina di test per vedere il tutto in azione è disponibile
qui.
Grazie a chi potrà svelarmi questo mistero.