When Checkbox Checked Make Other Same Value Checkboxes Disabled

How to make other same value checkbox disabled when one checked.

Solution 1:

Use a change() event handler and disable other elements based on the checked property. Where you can get other elements with same value using filter() method and attribute equals selector.

// cache the elementsvar $chk = $("[name='check[]']");
// bind change event handler
$chk.change(function() {
  $chk
    // remove current element
    .not(this)
    // filter out element with same value
    .filter('[value="' + this.value + '"]')
    // update disabled property based on the checked property
    .prop('disabled', this.checked);
})

<scriptsrc="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script><inputtype='checkbox'name='check[]'value='1'><inputtype='checkbox'name='check[]'value='2'><inputtype='checkbox'name='check[]'value='1'><inputtype='checkbox'name='check[]'value='2'>

Solution 2:

Something like that should work if you want to disable only the other checkbox with the same value and not the checkbox who is checked :

$("input[name='check[]']").on('click', function() {
  var val = $(this).val();
  var parent = $(this);
  $("input[value='"+val+"']").each(function() {
    $(this).not(parent).attr('disabled', parent.is(':checked'));
  });
})

Demo

Solution 3:

your html :

    <inputtype='checkbox'class="chk"id="chk_id" name='check[]' value = '1'>
    <inputtype='checkbox'class="chk"id="chk_id" name='check[]' value = '2'>
    <inputtype='checkbox'class="chk"id="chk_id" name='check[]' value = '1'>
    <inputtype='checkbox'class="chk"id="chk_id" name='check[]' value = '2'>

Your script :

  $(document).ready(function(){
      $("#chk_id").click(function(){
        var current_value = $(this).val();
              $("input[type='checkbox']").each(function() {
                if($(this).val() == current_value){
                  $(this).attr("disabled", true);
                }
            });

       }); 
  });