javascript - Bootstrap control accordion from seperate menu -

javascript - Bootstrap control accordion from seperate menu -

i have set of 4 bootstrap accordions , i'm using dropdown menu in navigation open accordions.

i can open accordions when open more 1 doesn't close opened accordions, there way close opened accordion when link clicked?

$('li.accordion-nav a').click(function() { var alink = $(this).attr('href').replace(/^.*?(#|$)/,''); $('#' + alink).collapse('show', function(){ $('.accordion-panel').not('#' + alink).collapse('hide'); }); });

may can utilize thing far understand correctly:

js:

$( "select" ).change(function(e) { var val = $("select option:selected").val(); $('a#' + val).click(); }); $('a[data-parent="#accordion"]').click(function(e) { $('select#dropdown').val($(this).attr('id')); });

html:

<div> <select id='dropdown'> <option value="1">1</option> <option value="2">2</option> <option value="3">3</option> </select> </div> <br> <div class="panel-group" id="accordion"> <div class="panel panel-default"> <div class="panel-heading"> <h4 class="panel-title"> <a data-toggle="collapse" data-parent="#accordion" href="#collapseone" id='1'> collapsible grouping item #1 </a> </h4> </div> <div id="collapseone" class="panel-collapse collapse in"> <div class="panel-body"> anim pariatur cliche </div> </div> </div> .... </div>

here jsfiddle link

javascript jquery twitter-bootstrap