selecting closest select from checkbox when unchecked?

Question

I'm trying to select the value of a dropdown (select) based on whether my checkbox is checked or not. Here's the code i'm using, but it's not working:

    <select name="scType" class="scType" onchange="$('.all').hide();$('.'+this.value).show();" style="display:none;">
      <option value="One" selected>One</option>
      <option value="Two">Two</option>
    </select>

<span id="showActiveS" style="display:none;"><input name="showActive" class="showActive" type="checkbox" id="showActive" onclick="(this.checked)?$('.isNotActive').hide():$('.'+$(this).closest('.scType').val().show())"> Show Only Active?</span>

The $('.isNotActive').hide() part works, but i can't get the other part to work. Any ideas?

Answer 1

This example shows how to output a selected value of a drop down on checkbox checked with jQuery.

HTML:

<select name="scType" class="scType">
  <option value="Five" selected>Five</option>
  <option value="Six">Six</option>
</select>

<select name="scType" class="scType">
  <option value="Three" selected>Three</option>
  <option value="Four">Four</option>
</select>

<select name="scType" class="scType">
  <option value="One" selected>One</option>
  <option value="Two">Two</option>
</select>

<span id="showActiveS">
<input name="showActive" class="showActive" type="checkbox" id="showActive">
Display Closest Drop Down Value
</span>

<div>Output: <span id="output"></span></div>

Javascript:

$('.showActive').on('click', function(){ 
  if ($(this).prop('checked'))
    $('#output').text($(this).parent().prev('.scType').val());
  else 
    $('#output').empty();
});

Updated JSFiddle: https://jsfiddle.net/cv22hwm6/7/