Disable checkboxes when 6 are checked — multiple forms on page with checkbox groups

Question

I have multiple forms on a page, each have 30 or so checkboxes in them (the amount of forms varies depending upon the user upload). I need to have it setup when 6 checkboxes are checked the rest in that group of checkboxes that are not checked are disabled.

I can sort out doing so with one form pretty simply -- something like:

$("input:checkbox").click(function() {
      var cbk = $("input:checkbox:checked").length >= 6;    
     $("input:checkbox").not(":checked").attr("disabled",cbk);

    }); 

But this ends up disabling the checkboxes for ALL the forms. Been trying to find different ways to sort this out but not having much luck. Any and all help is appreciated. Thanks.

Answer 1

Please try this:

$("input:checkbox").click(function() {
      var frm = $(this).closest("form").attr("id");//getting the id of nearest form
      var cbk = $("#" + frm + " input:checkbox:checked").length >= 6;    
     $("#" + frm + " input:checkbox").not(":checked").attr("disabled",cbk);

    }); 

logic is: Find the form in which that checkbox that was clicked resides. And use that form as a filter.

HTH