Open an accordion from an outside link

Question

I know that this question has been asked here and numerous other places before, but none of the solutions provided have worked for me. I'm not sure if it's because I'm implementing them wrong or if something is just screwy with my script. I'm using the jQuery UI and I have more than one accordion on my page. I want the first header of the second accordion to open from an external link. Here is my script:

   <script type="text/javascript">
   $(function() {
   $( "#accordion" ).accordion({
      active: false,
      collapsible: true,
      heightStyle: "content",
      navigation: true
   });
   $( "#accordion2" ).accordion({
      active: false,
      collapsible: true,
      heightStyle: "content",
      navigation: true
   });
   </script>


   <div>
   <h7 id="misc">Misc</h7>
   <div id="accordion">
      <h3 id="rent"><a href="#rent"> ...text.... </a></h3>
      <div><p> ...text... </p></div>
   </div></div>
   <div>
   <h7 id="misc2">Misc2</h7>
   <div id="accordion2">
      <h3 id="rent2"><a href="#rent2"> ...text.... </a></h3>
      <div><p> ...text... </p></div>
      <h3 id="rent3"><a href="#rent3"> ...text.... </a></h3>
      <div><p> ...text... </p></div>
   </div></div>

I have tried changing my second accordion to:

$( "#accordion2" ).accordion("activate", '<%= Request.QueryString["id"] %>');
});

As recommended here: Link to open jQuery Accordion And have also tried the .accordion("activate", window.location.hash) also listed on that page, and tried adding the additional function:

$(document).ready(function () {
location.hash && $(location.hash).active('true');

I have also tried the example given here: https://forum.jquery.com/topic/accordion-open-a-specific-tab-with-link-from-another-page . Not only did this not work for me, but it removed the accordion formatting from my second drop down on the second accordion.

I'm very new to jQuery so the solution is probably something very simple, but I've tried several things already (I just listed the few above because those are the ones I remember).

I'm also linking to the drop down using: site.com/page/one.html#rent2, just in case that's the issue. Any help would be appreciated. Thanks!

Answer 1

Ok, I was able to figure out something that worked for me. To my original $(function(), with the accordions, I added:

   `var hash = window.location.hash;
    var anchor = $('a[href$="'+hash+'"]');
    if (anchor.length > 0){
        anchor.click();
   }`  

And then to my html I added:

  `<h3><a href="#rent" id="rent">...text...</a></h3>`

This did exactly what I needed, I don't remember where I found the link to it though...