I want to show/hide multiple options regarding to an option selected before.
I can do it with multiple string but I want it in "one string".
ai95 is my first dropdown menu, ai96 is second one.
For example;
$(document).ready(function(){
var uniad = $('[name*="_ai95_"]').val();
if (uniad > 0 && uniad < 2)
{
$('[name*="_ai96_"]').children().hide();
$('[name*="_ai96_"]').children('option[value="1"]').show();
$('[name*="_ai96_"]').children('option[value="15"]').show();
$('[name*="_ai96_"]').children('option[value="25"]').show();
}else if (uniad > 1 && uniad < 3)
{
$('[name*="_ai96_"]').children().hide();
$('[name*="_ai96_"]').children('option[value="11"]').show();
$('[name*="_ai96_"]').children('option[value="35"]').show();
$('[name*="_ai96_"]').children('option[value="25"]').show();
and more "else if" like them...}
This is just a part of what I want to do it. I just want to: firstly hide them all then show some of them by shrinking the string like this:
else if (uniad > 1 && uniad < 3){
$('[name*="_ai96_"]').children().hide();
$('[name*="_ai96_"]').children('option[value="11"]', 'option[value="35"]','option[value="25"]').show();`
Is there any way to do this? Thanks.
Something like this?
var selectEl = $("#second-select");
selectEl.children().hide()
.end() // return to the parent node
.children("[value='3'], [value='5'], [value='12']").show();
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
Second select box:
<select id="second-select" name="uc_autorilist[]" size="5" multiple>
<option value="3">Rose Tremain</option>
<option value="4">Jonathan Coe</option>
<option value="5">Cecilia Ahern</option>
<option value="6">Marinel Serban</option>
<option value="7">Emanuela Cherchez</option>
<option value="8">Peter Buckley</option>
<option value="9">Clark Duncan</option>
<option value="10">Carlos-Ruiz Zafon</option>
<option value="11">Catalin Paduraru</option>
<option value="12">Dan-Silviu Boerescu</option>
</select>