0

I have the checkboxes and I want to check the checkbox with specific value id checked in jquery I want to check the check box meetingcategory with value 'test' is checked if checked need to uncheck the relatedto checkbox lead and contacts.

$(".meetingcategory input").click(function(){
if($(this).val()=='test') //need to check is checked
  {
     $('.relatedto input[value="Leads"]').prop('checked', false);
     $('.relatedto input[value="Contacts"]').prop('checked', false);
  }
  else{
      $('.relatedto input[value="Leads"]').prop('checked', true);
      $('.relatedto input[value="Contacts"]').prop('checked', true);
  }
  });
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class='meetingcategory'>
<input type="checkbox" title="test" id="ms-opt-124" value="test">test
<input type="checkbox" title="test1" id="ms-opt-124" value="test1">test1
</div>
<div id='relatedto'>
<label for="ms-opt-1"><input type="checkbox" title="Leads" id="ms-opt-1" value="Leads" checked>Leads</label>
<label for="ms-opt-1"><input type="checkbox" title="Contacts" id="ms-opt-1" value="Contacts" 
 checked>Contacts</label>
<label for="ms-opt-1"><input type="checkbox" title="Blank" id="ms-opt-1" value="Blank" checked>Blank</label>
</div>

2
  • 1
    relatedto is an id, not a class, so you should use #relatedto instead of .relatedto. Also, ids must be unique so you can't have all the checkboxes with the same id. Commented Sep 30, 2020 at 4:59
  • As for the question itself - what you're trying to do is not very clear. Can you explain a bit more or maybe show an example so we can understand what you wanr? Commented Sep 30, 2020 at 5:01

2 Answers 2

1

$(".meetingcategory input").click(function() {
  if ($(this).val() == 'test') //need to check is checked
  {
    $('input[value="Leads"]').prop('checked', false);
    $('input[value="Contacts"]').prop('checked', false);
  } else {
    $('input[value="Leads"]').prop('checked', true);
    $('input[value="Contacts"]').prop('checked', true);
  }
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class='meetingcategory'>
  <input type="checkbox" title="test" id="ms-opt-124" value="test">test
  <input type="checkbox" title="test1" id="ms-opt-124" value="test1">test1
</div>
<div id='relatedto'>
  <label for="ms-opt-1"><input type="checkbox" title="Leads" id="ms-opt-1" value="Leads" checked>Leads</label>
  <label for="ms-opt-1"><input type="checkbox" title="Contacts" id="ms-opt-1" value="Contacts" 
 checked>Contacts</label>
  <label for="ms-opt-1"><input type="checkbox" title="Blank" id="ms-opt-1" value="Blank" checked>Blank</label>
</div>

I am not sure, why are you using ".relatedto" in the selector, this is working fine.

Sign up to request clarification or add additional context in comments.

2 Comments

if test1 is checked need to check all 3 option in relatedto even test is checked.but if if choose both test and test1.checked only blank.
as mentioned above in the comment by @FluffyKitten, .relatedto is a class selector, you can use #relatedto as ID selector
0

No need this .relatedto. you can use the only attribute

$(".meetingcategory input").click(function(){
if($(this).val()=='test') //need to check is checked
  {
     $('.relatedto input[value="Leads"]').prop('checked', false);
     $('.relatedto input[value="Contacts"]').prop('checked', false);
  }
  else{
      $('.relatedto input[value="Leads"]').prop('checked', true);
      $('.relatedto input[value="Contacts"]').prop('checked', true);
  }
  });
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class='meetingcategory'>
<input type="checkbox" title="test" id="ms-opt-124" value="test">test
<input type="checkbox" title="test1" id="ms-opt-124" value="test1">test1
</div>
<div id='relatedto'>
<label for="ms-opt-1"><input type="checkbox" title="Leads" id="ms-opt-1" value="Leads" checked>Leads</label>
<label for="ms-opt-1"><input type="checkbox" title="Contacts" id="ms-opt-1" value="Contacts" 
 checked>Contacts</label>
<label for="ms-opt-1"><input type="checkbox" title="Blank" id="ms-opt-1" value="Blank" checked>Blank</label>
</div>

$(".meetingcategory input").click(function(){
if($(this).val()=='test') //need to check is checked
  {
     $('input[value="Leads"]').prop('checked', false);
     $('input[value="Contacts"]').prop('checked', false);
  }
  else{
      $('input[value="Leads"]').prop('checked', true);
      $('input[value="Contacts"]').prop('checked', true);
  }
  });
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class='meetingcategory'>
<input type="checkbox" title="test" id="ms-opt-124" value="test">test
<input type="checkbox" title="test1" id="ms-opt-124" value="test1">test1
</div>
<div id='relatedto'>
<label for="ms-opt-1"><input type="checkbox" title="Leads" id="ms-opt-1" value="Leads" checked>Leads</label>
<label for="ms-opt-1"><input type="checkbox" title="Contacts" id="ms-opt-1" value="Contacts" 
 checked>Contacts</label>
<label for="ms-opt-1"><input type="checkbox" title="Blank" id="ms-opt-1" value="Blank" checked>Blank</label>
</div>

Comments

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.