venerdì 15 luglio 2011

Selezionare o deselezionare tutte le opzioni per una checkbox.

Quando si ha un form con molte opzioni rappresentate dall'elemento checkbox, può tornare utile avere la possibilità di selezionare o deselezionare tutte le opzioni in un solo colpo. Lo script riportato permette, con semplici modifiche, di essere riutilizzato in molti form html.

<html>
<head>
  <title>Checkbox Selezione/Deseleziona tutto</title>
  <script type="text/javascript">
    <!--
    function selezionaDeselezionaTutto(my_checkbox_group){
      // Dimensione dell'array
      var dimensione=my_checkbox_group.length;
      // Ultima opzione
      var status = my_checkbox_group[dimensione-1].checked;
      // Ciclo di Selezione/Deselezione
      for (var i=0; i<dimensione; i++){
        my_checkbox_group[i].checked=status;
      }
    }
    //-->
  </script>
</head>
<body>
  <form id="my_form" name="my_form" action="form.html" method="post">
  <input type="checkbox" name="my_checkbox_group" value="op1" /> 1<br />
  <input type="checkbox" name="my_checkbox_group" value="op2" /> 2<br />
  <input type="checkbox" name="my_checkbox_group" value="op3" /> 3<br />
  <input type="checkbox" name="my_checkbox_group" value="op4" /> 4<br />
  <input type="checkbox" name="my_checkbox_group" value="op5" /> 5<br />
  <br />
  <input type="checkbox" name="my_checkbox_group" value="all"   
onclick="selezionaDeselezionaTutto(document.my_form.my_checkbox_group);"/> Seleziona tutto<br />
  </form>
</body>
</html>

Nessun commento:

Posta un commento