We help IT Professionals succeed at work.

Expand accordion with button outside the accordion

mattegol used Ask the Experts™

I need to expand panes in a accordion when clicking on a button outside of the accordion.

Are there any ways to do this server side, or do I need to make a javascript solution?
Watch Question

Do more with

Expert Office
EXPERT OFFICE® is a registered trademark of EXPERTS EXCHANGE®

the easiest way is to do it via javascript(jquery) client side. this works if the button is on the same page.

<div class="accordion"></div>
etc. ....
<div class="button">

Open in new window

 if you want to do expand a accordion via a button on a page other than the accordion page, pass a variable via get which holds the number of the pane you wann open like this:

<div class="button-expand-acc"><a href="www.whateveryoursiteis.com/accordion.html?acc=3"></a></div>

Open in new window

on accodion.html:

var urlstr = window.lacation;
var leng = urlstr.length -1; 
var activeaccpane = urlstr.substring(leng-1 ,leng ); // this works only if the parameter is the last in passed url
$(".button").accordion({ active: activeaccpane });

Open in new window

Sorry for the same page example is missing some code:

javascript code for the button:
$(".accordion").accordion({active: 2});

Open in new window

Cool, i will now copy links to other tutorials in every question here. It seems to be more efficient.

Somtimes it is, not all the time though!