how to display related items in another dropdown using html and jQuery
i am having two DropDownList.
whenever i select first dropdown value second dropdown value automatically gets checked and also shows other items list.
pls kindly help unable to find solution.
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" />
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-select/1.12.4/css/bootstrap-select.min.css">
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/bootstrap-select/1.7.5/js/bootstrap-select.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
<select id="id1" name="name1" class="selectpicker" data-style="form-control" data-live-search="true" multiple="multiple" tabindex="-98">
<option value="A">Fruits</option>
<option value="B">Animals</option>
</select>
<select id="id2" name="name2" class="selectpicker" data-style="form-control" data-live-search="true" multiple="multiple" tabindex="-98">
<option class="A">apple</option>
<option value="A">banana</option>
<option value="A">dragon</option>
<option value="B">monkey</option>
<option value="B">lion</option> <option value="B">tiger</option>
</select>
$('#id1').on('changed.bs.select', function (e) {
var result = $('select[name=name1]').val();
$('select[name=name2]').val(result);
$('#id2').selectpicker('refresh');
});
