Jquery

jQuery: seleziona tutto (e deseleziona)

Spesse volte capita di realizzare delle form contenenti una serie di checkbox (per esempio un elenco delle nazioni), dove l’utente può selezionarne più d’una. Se l’elenco è molto lungo e l’utente ha necessità di selezionarle anche tutte, di solito si inseriscono un paio di pulsanti che permettono di fare una seleziona/deselezione di massa.

Con jQuery è molto semplice e basta una riga di codice.

Intanto costruiamo l’html:


<a href="javascript:selectAll()">seleziona tutto</a> | <a href="javascript:deselectAll()">Deseleziona tutto</a>
<div id="cont_nazioni">
<input type="checkbox" name="nazioni[]" value="IT">Italia<br />
<input type="checkbox" name="nazioni[]" value="FR">Francia<br />
....
<input type="checkbox" name="nazioni[]" value="DE">Germania<br />
<input type="checkbox" name="nazioni[]" value="ES">Spagna<br />
</div>


E poi le due funzioni Javascript per eseguire la selezione e la deselezione:


<script type="text/javascript">
function selectAll() {
$("#cont_nazioni :checkbox").attr({ checked: "checked"});
}

function deselectAll() {
$(“#cont_nazioni :checkbox”).removeAttr(“checked”);
}
</script>

Ovviamente per far funzionare il tutto ricordate di includere anche la classe jQuery.

Continua a leggere

• jQuery e bug nella funzione position()
• Menù a tendina orizzontale e jQuery

Simone Volpini - P.IVA 02390480420