javascript - Disable/enable checkboxes based on its values and selected option -


i need hardcode of values of checkboxes enabled/disabled, depending on selected option value. trying this:

$("#units").on("change", function () {    if ($(this).val() !== "finance") {      $(".dissable").val("3").prop("disabled", true);       $(".dissable").val("4").prop("disabled", true);     } else {      $(".dissable").val("3").prop("disabled", false);      $(".dissable").val("4").prop("disabled", false);    }  }).trigger('change');
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>    <select id="units">    <option value="marketing" > marketing </option>    <option value="finance" > finance </option>    <option value="operations" > operations </option>  </select>    <input type="checkbox" class="dissable" onclick="check();" value="1"> chbx1  <input type="checkbox" class="dissable" onclick="check();" value="2"> chbx2  <input type="checkbox" class="dissable" onclick="check();" value="3"> chbx3  <input type="checkbox" class="dissable" onclick="check();" value="4"> chbx4

but no desired effect, supposed this:

  • when choose option other "finance", checkbox no. 3 , 4 disabled.
  • for "finance", checkboxes enabled.

i need based on checkbox values, not class.

use following selector:

$(".dissable[value='3']").prop("disabled", true); 

the [value='3'] creates selection based on value. see working example:

$("#units").on("change", function () {    if ($(this).val() !== "finance") {      $(".dissable[value='3']").prop("disabled", true);       $(".dissable[value='4']").prop("disabled", true);     } else {      $(".dissable[value='3']").prop("disabled", false);      $(".dissable[value='4']").prop("disabled", false);    }  }).trigger('change');
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>    <select id="units">    <option value="marketing" > marketing </option>    <option value="finance" > finance </option>    <option value="operations" > operations </option>  </select>    <input type="checkbox" class="dissable" onclick="check();" value="1" /> chbx1  <input type="checkbox" class="dissable" onclick="check();" value="2" /> chbx2  <input type="checkbox" class="dissable" onclick="check();" value="3" /> chbx3  <input type="checkbox" class="dissable" onclick="check();" value="4" /> chbx4
(fiddle: http://jsfiddle.net/2sw3q8p4/)


Comments

Popular posts from this blog

android - MPAndroidChart - How to add Annotations or images to the chart -

javascript - Add class to another page attribute using URL id - Jquery -

firefox - Where is 'webgl.osmesalib' parameter? -