checkbox enable/disable from jquery

Question

I have a question for onclick action. After clicking the "all" checkbox, <select> is blocked, but no "cl" is unchecked.

<form>
  <input type="checkbox" class="custom-control-input" id="all" name="all" onclick="this.form.elements['oh'].disabled = this.form.elements['cl'].removeAttr('checked') = this.checked">

  <select id="oh" name="oh">
    <option value="1">option 1</option>
    <option value="2">option 2</option>
    <option value="3">oprion 3</option>
  </select>

  <input type="checkbox" id="cl" name="cl">
</form>

Best [to avoid inline handlers](https://stackoverflow.com/a/59539045), they have a demented scope chain, require global pollution, and have quote escaping issues. Use `addEventListener` instead — CertainPerformance, May 11 '20 at 09:16
I made you a snippet. Please fix the console errors - I wrapped in form tags to remove one error - you are mixing jQuery functions into DOM coding. `this` is NOT a jQuery object — mplungjan, May 11 '20 at 09:18
There is a lot of wishful coding going on. Please describe what you WANT to happen instead of posting an X/Y problem — mplungjan, May 11 '20 at 09:20
Please also check your browser console for errors. Browsers these days hide errors unless you have a 3rd party extension. *"but no "cl" is unchecked"* - but there is an error in the console which explains the issue to you (perhaps not in a way you fully understand yet, but it's explained there - so should be asking "why do I get "removeAttr is not a function" rather than asking why it "does nothing" (paraphrased). — freedomn-m, May 11 '20 at 09:22

mplungjan · Accepted Answer · 2020-05-11T09:31:56.753

I believe you MIGHT mean this

$("#all").on("click",function() {
  const chk = this.checked;
  $("#oh").prop("disabled",chk)
  $("#cl").prop('checked',!chk)
})

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<form>
  <input type="checkbox" class="custom-control-input" id="all" name="all" />

  <select id="oh" name="oh">
    <option value="1">option 1</option>
    <option value="2">option 2</option>
    <option value="3">oprion 3</option>
  </select>

  <input type="checkbox" id="cl" name="cl">
</form>

checkbox enable/disable from jquery

1 Answers1