checkbox validation using jquery

Question

I'm searching a while for this and I can't found something that works for me.

I have this checkbox:

 <%= Html.CheckBox("cbCodigo") %> <label class="inline" for="Codigo">Codigo</label>
 <%= Html.CheckBox("cbNombreCliente") %> <label class="inline" for="NombreCliente">Nombre del cliente</label>
 <%= Html.CheckBox("cbCiudad") %> <label class="inline" for="Ciudad">Ciudad</label>

I want to validate that only one is checked when a textbox change, something like this, and use .validate of jQuery, I don't what is the best way for validate this.

tbCodCliente is a textbox that I use as a search parameter, and the checkbox is a parameter or a value for the autocomplete function of the textbox

$('#tbCodCliente').change(function() {
     if ($('#cbCodigo').attr('checked', false) &&
          $('#cbNombreCliente').attr('checked', false) &&
          $('#tbCheckbox').attr('checked', false)) {

          // function for validate method          
     }
});

I trying to validate of this way, but I don't know if it is the best way.

EDIT: I want something like this, but still can found how make it works

('#tbCodCliente').change(function() {
    if( $("input:checked").length == 0 ) {
        $("#request-form").validate({
             rules: {
                 checkbox: { 
                     required: 'input[type="checkbox"]:checked',
                     minlength: 1
                 }   
             },
             messages: {
                 checkbox: {"Please check at least one."}
             }
        })        

    }
});

score 2 · Accepted Answer · answered Mar 27 '12 at 14:09

2

If these are the only checkboxes available on the page then you can try following jQuery statement to check:

if( $("input:checked").length == 1 )

Edit:

To be more precise, you can change the validation code to following:

$('#tbCodCliente').change(function() {
   if( $("input:checked").length == 1 ) {
       //Do stuff here
   }
});

answered Mar 27 '12 at 14:09

Epuri

280
2
5

thanks!, yes, there are the only checkbox of the form, but how i use the .validate() of jquery? – Alejandro Hinestrosa Mar 27 '12 at 14:12
2

And if they're not the only ones, you still are able to refer from the container (via class or id) to it: if( $(".container input:checked").length == 1) { /* ... */ } – Shion Mar 27 '12 at 14:12
yes!! it helps a lot, i'm still searching how to use .validate() if none checkbox are checked – Alejandro Hinestrosa Mar 27 '12 at 14:16
Here is the answer from one of the similar question [link](http://stackoverflow.com/questions/1300994/jquery-validate-require-at-least-one-field-in-a-group-to-be-filled/1483018#1483018) – Epuri Mar 27 '12 at 14:31
$('input:checkbox[name=name_your_checkbox\\[\\]]:checked').length == 1 – jd_7 Mar 27 '12 at 15:13

score 1 · Answer 2 · answered Mar 27 '12 at 14:17

1

This will uncheck other checkboxes once any single checkbox is checked.

$('input:checkbox').change(function () {
        if (this.checked) {
            $('input:checkbox:not(#'+this.id+')').attr('checked', false);
        }
});

Demo: http://jsfiddle.net/5btfe/

And for single-checkbox-selected check you can refer epuri's answer which is quite correct.

answered Mar 27 '12 at 14:17

codef0rmer

10,284
9
53
76

yes indeed, thanks!. i want to know how i use .validate of jquery, for show an alert if none of the checkbox is checked – Alejandro Hinestrosa Mar 27 '12 at 14:24
you can add the above check into a custom method which will be called directly into validate call.http://stackoverflow.com/questions/241145/jquery-validate-plugin-how-to-create-a-simple-custom-rule – codef0rmer Mar 28 '12 at 05:25

checkbox validation using jquery

2 Answers2