0

I have a site that uses jquery UI accordions on different pages. The script for these accordions is on the page in each case.

We're looking into daily site prints for all pages so we need those accordions to be fully expanded when we do the site print (we'll be doing this by detecting the site printer's userAgent string because they can issue a custom one).

The site printer can halt execution of javascript on a page to keep content fully expanded but we also use AJAX scripts so that would prevent content from loading.

So we need a script that targets any jquery accordions on a page and makes them fully expand. We have a custom.js file that is present on all pages so we could place a command there.

My question is, is it possible to target all instances of accordion objects without already knowing what they are? I'm looking at the possibility of putting a script in the custom.js file rather than having to rewrite all the JQuery accordion calls page by page (and trying to get everybody that adds stuff to the site to also remember to write a conditional userAgent based expand everytime they use an accordion).

methodOverload
  • 3
  • 2
  • 1
    As long as you can find a selector that matches all the accordions on every page, I see no reason why it wouldn't be possible. You should show some code so people would be able to help you. – caisah Nov 17 '17 at 18:08
  • So like I could add a class manually page by page to all my accordions and then target that class in the script? Would that work? Because they have different IDs. – methodOverload Nov 17 '17 at 18:33
  • Yes. That's right! – caisah Nov 17 '17 at 18:39
  • You can also test each `$("div")` to see if it has an accordion instance. Most likely, you will just use `$(".ui-accordion")` since this class is added to the elements when Accordion is initialized. – Twisty Nov 17 '17 at 18:54

1 Answers1

0

Without seeing your code or knowing anything about your current HTML, you can try something like this:

$(".ui-widget.ui-accordion").each(function(index, elem){
  // Code that you want to execute on each Accordion
  // For example, we could disable each one:
  $(elem).accordion("disable");
});

I don't see a method to expand all panels at once. Likely, you would have to activate each panel.

Found this: jQuery UI Accordion Expand/Collapse All

It advises using the theming to make the accordion look correct, and then roll your own ability to expand all.

Twisty
  • 23,484
  • 1
  • 22
  • 40
  • Thank you. I think that will do it. And yes I know I didn't supply code but that was kind of the point of the request, to write a script that would work without having to know what specific script I ran on each page. Thank you for this. – methodOverload Nov 17 '17 at 19:52