CODEWITHSUNDEEP
javascriptjquerycheckboxhtml-select
user1852728
user1852728

Reputation: 161

Uncheck checkbox when certain values from drop down is chosen

I need to uncheck my checkbox when i choose a certain value from my drop down list or when the user does not select any value from the drop down list. Im using Jquery at the moment. This is the code that im using right now but it won't work.

Script 

<script src="js/jquery-1.8.3.js"></script>
<script>
function sdp4(str) {
       if (  
   $('#drop1').val()!= '' 
|| $('#drop1').val()== "In Process"
|| $('#drop1').val()== "KIV" )

{$('#checkbox1').prop('checked', false);} 
else 
{$('#checkbox1').prop('checked', true);}
</script>

HTML

<select class="form-dropdown"  id="drop1" name="drop1" onchange="sdp4">
        <option value=""> </option>
        <option value="In Process"> In Process </option>
        <option value="KIV"> KIV </option>
        <option value="Completed"> Completed </option>
        </select>  
<input type="checkbox" checked="checked" id="checkbox1" name="checkbox1" />

Upvotes: 3

Views: 4184

Answers (3)

Jai
Jai

Reputation: 74738

Try this: http://jsfiddle.net/7cqDB/

function sdp4(str) {
  if (str == '' || str == "In Process" || str == "KIV") {
      $('#checkbox1').prop('checked', false);
  } else {
      $('#checkbox1').prop('checked', true);
  }
}

$(function () {
   $('select').on('change', function () {
       var str = $(this).val();
       sdp4(str);
   });
});

Upvotes: 0

ROY Finley
ROY Finley

Reputation: 1416

Assuming the only time you want the check box checked is when completed is selected:

 $("#drop1").on('change', function () {
    var val = $(this).val();
    if (val === " " || val === "In Process" || val === "KIV") {
        $('#checkbox1').prop('checked', false);
        return;
    }
    $('#checkbox1').prop('checked', true);
});

and html:

<select class="form-dropdown" id="drop1" name="drop1">
    <option value=" "></option>
    <option value="In Process">In Process</option>
    <option value="KIV">KIV</option>
    <option value="Completed">Completed</option>
</select>
<input type="checkbox"  id="checkbox1" name="checkbox1"/>

Here is a FIDDLE

Upvotes: 2

Explosion Pills
Explosion Pills

Reputation: 191729

You need to actually bind the call to sdp4 to something:

$("#drop1").on('change', sdp4);

At that point it would also be redundant to use #drop1 in the selectors when you could use this.

Upvotes: 0

Related Questions