Visualizzazione post con etichetta html. Mostra tutti i post
Visualizzazione post con etichetta html. Mostra tutti i post

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>

Intercettazione pressione tasto invio in una pagina HTML.

Per molti controlli lato client può tornare utile inibire la pressione di un tasto, verificare una combinazione o memorizzare un'azione. Le collezioni event.keyCode ed  event.which dell'oggetto window di JavaScript permette di lavorare con i codici numerici della tastiera, utili agli scopi citati in precedenza.
Il seguente codice permette di intercettare il codice di un tasto alla sua pressione, scatenando l'evento onkeyup associato al campo text di un form:

<html>
<head>
  <title>Intercettazione pressione tasto invio</title>
  <script type="text/javascript">
    <!--
    function intercettaPressioneTastoInvio(e) {
      // IE
      var tasto;
      if(window.event){
        tasto = e.keyCode;
      }
      // Netscape/Firefox/Opera
      else if(e.which){
        tasto = e.which;
      }
      if (tasto == 13) {
        alert("PREMUTO TASTO INVIO");
      }
    }
    //-->
  </script>
</head>
<body>
  Etichetta: <input type="text" onkeydown="intercettaPressioneTastoInvio(event);">
</body>
</head>