Vaibhav
Vaibhav

Reputation: 105

Disabling checkboxes with count validation jQuery

I have few checkboxes and I want as soon as a respondent checks 3rd checkbox remaining becoming disable and viceversa. However same is not working for me.

http://jsfiddle.net/u6Lbuwwe/1/

Below is the HTML code







Below is the jQuery code

$(document).ready(function(){
        var i=0;
    $("input:checkbox").click(function(){
            $('tr td').each(function{
                if($(this).find('checkbox').is(':checked'))
                    i++;
            });
        });
        if(i==3)
            $("input:checkbox").not(':checked').prop('disabled',true);
        else
            $("input:checkbox").not(':checked').prop('disabled',false);
    });

please find the link below to my fiddle and suggest on mistake and corrective actions.

Upvotes: 0

Views: 276

Answers (2)

Rafael
Rafael

Reputation: 7746

Simple and Clean

Working Ex.

http://jsfiddle.net/3kakcxzd/2/

var countChecked = function() {
    var n = $('input:checked').length;
    $('input[type=checkbox]:not(:checked)').prop('disabled', (n===3) ? true : false);
};

$('input[type=checkbox]').on('click', countChecked);

Upvotes: 1

roullie
roullie

Reputation: 2820

i tried your fiddle. add jQuery and it should work

$(document).ready(function(){
    var i=0;
    var chkBox = $("input[type=checkbox]");
    chkBox.click(function(){
        var i = 0;
        chkBox.each(function(){
            if($(this).is(':checked')) i++;
        });
        if(i==3)
            chkBox.not(':checked').prop('disabled',true);
        else
            chkBox.not(':checked').prop('disabled',false);  
    });

});

Upvotes: 3

Related Questions