2013-03-16 14 views
12

Sto utilizzando il plugin di convalida jQuery per convalidare la casella di controllo poiché non ha l'opzione predefinita, Si dovrebbe selezionare Uno e possono essere selezionate due caselle di controllo massime, questi sono i criteri. Non ricevo alcun errore e non sta convalidando. Lo sto estendendo come di seguito,jQuery Plugin di convalida: convalida casella di controllo

<input type="checkbox" name="test[]" />x 
    <input type="checkbox" name="test[]" />y 
    <input type="checkbox" name="test[]" />z 
    $("#formid").validate({ 
    rules: { 
    test[]: { 

      required: function(elem) 
      { 
       return $("input.select:checked").length > 0; 
      } 

      }, 
messages: { 

    test[]: "You must check at least 1 box" 
    } 
}); 

risposta

36

Hai avuto diversi problemi con il tuo codice.

1) Manca una parentesi di chiusura, }, all'interno di rules.

2) In questo caso, non è necessario utilizzare una funzione per la regola required. Per impostazione predefinita, il plugin è in grado di gestire gli ingressi checkbox e radio, quindi utilizzare true è sufficiente. Tuttavia, ciò farà semplicemente la stessa logica della funzione originale e verificherà che almeno uno sia selezionato.

3) Se si desidera controllare solo un massimo di due, è necessario applicare la regola maxlength.

4) L'opzione messages mancava la specifica della regola. Funzionerà, ma l'unico messaggio personalizzato si applicherebbe a tutte le regole sullo stesso campo.

5) Se un attributo name contiene parentesi, you must enclose it within quotes.

DEMO: http://jsfiddle.net/K6Wvk/

$(document).ready(function() { 

    $('#formid').validate({ // initialize the plugin 
     rules: { 
      'test[]': { 
       required: true, 
       maxlength: 2 
      } 
     }, 
     messages: { 
      'test[]': { 
       required: "You must check at least 1 box", 
       maxlength: "Check no more than {0} boxes" 
      } 
     } 
    }); 

}); 
1

V'è il modo più semplice

HTML:

<input type="checkbox" name="test[]" />x 
<input type="checkbox" name="test[]" />y 
<input type="checkbox" name="test[]" />z 
<button type="button" id="submit">Submit</button> 

JQuery:

$("#submit").on("click",function(){ 
    if (($("input[name*='test']:checked").length)<=0) { 
     alert("You must check at least 1 box"); 
    } 
    return true; 
}); 

Per questo non è necessario alcun plug-in. Divertiti;)

+5

Forse è più breve, ma @ram utilizza il plugin di convalida e quel plug-in utilizza le regole per convalidare – Limon

+0

Questo è vero ma ho messo questa soluzione simile senza librerie aggiuntive. –

+4

@ IvijanStefanStipić ma hai usato jquery ... –

Problemi correlati