Semplice JavaScript Checkbox Validation

Di solito lavoro con PHP, quindi purtroppo non ho alcuni principi base per JS. Questo è tutto ciò che voglio realizzare – ho visto molti post su questo argomento ma di solito sono oltre ciò di cui ho bisogno.

Ecco la mia forma:

  

La casella di controllo è un semplice “Accetto”. Voglio che il pulsante di invio sia premuto e verrà inviato solo se la casella di controllo è selezionata.

Ecco la cosa: voglio il modo semplice e ingannevole – nessun metodo – solo un codice inline in quella forma (supponendo che non sia troppo lungo?). Questa non è una pagina pubblica, ho solo bisogno di qualcosa di veloce e semplice con quel tipo di convalida. Se è deselezionato, genererà un avviso (); se è selezionato, invierà via posta tramite php e procederà normalmente.

Potresti usare:

  if(!this.form.checkbox.checked) { alert('You must agree to the terms first.'); return false; } 

( pagina demo ).

   
  • Restituire false da un gestore eventi in linea impedirà l’esecuzione dell’azione predefinita (in questo caso, l’invio del modulo).
  • ! è l’ operatore booleano NOT .
  • this è il pulsante di invio perché è l’elemento al quale è collegato il gestore eventi.
  • .form è la forma in cui si trova il pulsante di invio.
  • .checkbox è il controllo denominato “checkbox” in tale forma.
  • .checked è true se la casella è spuntata e false se la casella è deselezionata.

Puoi fare qualcosa del genere:

 

This...

http://lab.artlung.com/validate-checkbox/

Sebbene sia meno leggibile, questo può essere fatto senza una definizione di funzione separata come questa:

 

This...

Per ora non sono necessari jquery o php. Usa solo l’input HTML5 “richiesto” attrbuto come qui

  

I have read and accept SOMETHING Terms and Conditions

Ciò convaliderà e impedirà qualsiasi invio prima che la casella di controllo sia triggers. Soluzione indipendente dalla lingua perché è generata dal browser web dell’utente.

Puoi fare quanto segue:

 

Ecco una demo funzionante – http://jsfiddle.net/Ccr2x/

 var confirm=document.getElementById("confirm").value; if((confirm.checked==false) { alert("plz check the checkbox field"); document.getElementbyId("confirm").focus(); return false; } 

Se la tua casella di controllo ha un ID di “checkbox”:

  if(document.getElementById('checkbox').checked == true){ // code here } 

HTH

Se l’ ID della casella di controlloElimina “, quindi per l’evento ” onclick ” del pulsante di invio, la funzione javascript può essere la seguente:

 html:   script:  

Un altro modo semplice è quello di creare una funzione e controllare se le caselle di controllo sono selezionate o meno, e disabilitare un pulsante in questo modo usando jQuery.

HTML:

   

JavaScript:

 var alterDisabledState = function () { var isMyCheckboxChecked = $('#myCheckbox').is(':checked'); if (isMyCheckboxChecked) { $('myButton').removeAttr("disabled"); } else { $('myButton').attr("disabled", "disabled"); } } 

Ora hai un pulsante che è disabilitato fino a quando non selezionano la casella di controllo, e ora hai una migliore esperienza utente. Mi piacerebbe che tu continuassi a fare la validazione sul lato server.

Un altro modo semplice è creare e invocare la funzione validate() quando il modulo viene caricato e quando si fa clic sul pulsante di invio. Utilizzando la proprietà checked controlliamo se la casella di controllo è selezionata o meno. cbox[0] ha un indice 0 che viene utilizzato per accedere al primo valore (es. Male) di name="gender"

Puoi fare quanto segue:

 function validate() { var cbox = document.forms["myForm"]["gender"]; if ( cbox[0].checked == false && cbox[1].checked == false && cbox[2].checked == false ) { alert("Please Select Gender"); return false; } else { alert("Successfully Submited"); return true; } } 
 
Male Female Other

Ragazzi, puoi fare questo tipo di convalida molto facilmente. Devi solo tracciare l’id o il nome delle caselle di controllo. puoi farlo staticamente o dynamicmente.

Per staticamente è ansible utilizzare l’ID hard codificato delle caselle di controllo e per dynamicmente è ansible utilizzare il nome del campo come array e creare un loop.

Si prega di controllare il link qui sotto. Otterrai il mio punto molto facilmente.

http://expertsdiscussion.com/checkbox-validation-using-javascript-t29.html

Grazie