Selezione di tutti i checkbox con Javascript

Autore: Luca Ruggiero | Tell a Friend Corso Java Impara a programmare col linguaggio OOP della Sun. Corso Javascript e DHTML Impara a creare controlli ed animazioni!

Concesso in esclusiva a MrWebmaster.it - E' vietata la pubblicazione senza espresso consenso del proprietario

Molte applicazioni Web, come le nostre caselle di posta elettronica, ci hanno abituato a non dover selezionare a mano tutte le opzioni singolarmente, ad esempio per cancellare tutte le email, ma ci mettono a disposizione la famosa opzione toggle all, ovvero seleziona tutte le checkbox in un colpo solo!

Per sfruttare questo sistema ricorriamo a Javascript.

Creiamo un modulo HTML di esempio, il cui bottone di selezione accede, all'evento onclick, alla funzione Javascript che creeremo in seguito:

<form name="modulo">
<input type="checkbox" name="colori" value="Rosso"> Rosso<br>
<input type="checkbox" name="colori" value="Giallo"> Giallo<br>
<input type="checkbox" name="colori" value="Verde"> Verde<br>
<input type="checkbox" name="colori" value="Blu"> Blu<br><br>
<input type="button" value="Seleziona tutto" onclick="SelezTT()">
</form>

<script type="text/javascript">
function SelezTT()
{
    var i = 0;
    var modulo = document.modulo.elements;
    for (i=0; i<modulo.length; i++)
    {
        if(modulo[i].type == "checkbox")
        {
            modulo[i].checked = !(modulo[i].checked);
        }
    }
}
</script>

document.modulo.elements

modulo[i].checked = !(modulo[i].checked)