1

I raised a question before about how to expand an accordion on a link click:

Twitter Bootstrap 3 - Auto Expand An Accordion When A Link Clicked In Another Accordion

To which I got the solution for, but now I have a different issue, how do I expand an accordion on another page from clicking a link on another page.

I have tried various ways as shown below none seem to work:

 1. <a class="collapsed" href="[PATH NAME]/#" data-toggle="collapse"
    data-target="#collapseTwo">Test</a>
 2. <a class="collapsed" href="#" data-toggle="collapse"
    data-target="[PATH NAME]/#collapseTwo">Test</a>
 3. <a class="collapsed" href="[PATH NAME]" data-toggle="collapse"
    data-target="[PATH NAME]/#collapseTwo">Test</a>
Community
  • 1
  • 1
murday1983
  • 3,806
  • 14
  • 54
  • 105
  • None of those will work because the collapse is on another page, you need a script for that. See answer – Christina Oct 03 '14 at 15:55

1 Answers1

2

This answer here answers your question:

Bootstrap Collapse - open the given id fragment

Put EITHER in your jQuery or JS

// === opens a collapse from a url
location.hash && $(location.hash + '.collapse').collapse('show');

OR -- not both

// === opens a collapse from a url
var anchor = window.location.hash.replace("#", "");
$(".collapse").collapse('hide'); // REMOVE THIS it and it will work more smoothly
$("#" + anchor).collapse('show');

The latter requires a load function. $(document).ready(function() { ... });

Then link to the collapsed section with the UNIQUE id like you would normally link to an anchor:

<a href="thepage.html#uniqueID">Link text</a>
Community
  • 1
  • 1
Christina
  • 34,296
  • 17
  • 83
  • 119