Accordians stopped working since upgrade

[AshleyF]

Hi,

Ref this thread about multiple nested accordions.

Accordians within an accordian

I had it working fairly well until I updates Pro at the weekend, and now I notice they’re not working at all. As the code changed at all? I stripped it right back to one and even that doesn’t open on the page. This is the code.

<!-------- START OF CHECKING ACCORDION -------->
<div id="checking-accordion" class="x-accordion">
<div class="x-accordion-group" data-cs-collapse-group="">
<div class="x-accordion-heading"><a class="x-accordion-toggle collapsed" data-cs-collapse-toggle="" data-cs-collapse-parent="#checking-accordion">Checking</a></div>
<div class="x-accordion-body collapse" style="height: 0px;" data-cs-collapse-content="">
<div class="x-accordion-inner">

The need to check is the compulsion, the obsessive fear might be to prevent damage, fire, leaks or harm. Common checking within OCD includes:

<!------ Reassurance ------>
<div id="ocdtype-accordion" class="ocduk-accordion">
<div class="ocduk-accordion-group" data-cs-collapse-group="">
<div class="ocduk-accordion-heading"><a class="ocduk-accordion-toggle collapsed" data-cs-collapse-toggle="" data-cs-collapse-parent="">For reassurance</a></div>
<div class="ocduk-accordion-body collapse" style="height: 0px;" data-cs-collapse-content="">
<div class="ocduk-accordion-inner">The sufferer will often seek reassurance about their OCD fears, usually from a loved one or via sources such as Google or local news outlets. Frequently the obsessional worry is that something bad may have happened to a loved one, so they will repeatedly check they're ok. Another obsessional fear leading to reassurance seeking compulsions is worries that their partner may no longer have feelings for them or love them or they may have upset the loved one.</div>
</div>
</div>
</div>

<!------ close of checking category ------>

</div>
</div>
</div>
<!------ End of checking category ------>

Is there a conflict with that CSS and the latest Pro? If I use the shortcode for the accordion that works, dis something change?

[thai]

Hi There,

We’ve changed the HTML structure of accordion element. You can follow this example HTML code:

<div id="my-accordion" class="x-accordion">
	<div class="x-accordion-group">
		<div class="x-accordion-heading"><a id="tab-5b0442250fe44" class="x-accordion-toggle collapsed" role="tab" data-x-toggle="collapse-b" data-x-toggleable="5b0442250fe44" aria-selected="false" aria-expanded="false" aria-controls="panel-5b0442250fe44" my-accordion="">Accordion Title</a></div>
		<div id="panel-5b0442250fe44" class="x-accordion-body x-collapsed" role="tabpanel" data-x-toggle-collapse="1" data-x-toggleable="5b0442250fe44" aria-hidden="true" aria-labelledby="tab-5b0442250fe44" style="">
			<div class="x-accordion-inner">Your text here</div>
		</div>
	</div>
</div>

Hope it helps

[AshleyF]

@thai

Hope it helps

It does thank you, it’s sorted the nested accordions out too by those tab ID’s it now looks great, just how I needed it (or will do). Will take some editing on my part as that page as lots of accordions, but worth it to get this looking right how I wanted, so thank you.

[nabeel]

Glad we could help.

Cheers!