Accordion Expand

Discussions about Forms Designer for SharePoint 2013 / 2016 and Office 365.
User avatar
rostislav
Moderator
Posts: 364
Joined: Mon Oct 19, 2015

19 Apr 2016

Set the accordion's mode to singleCollapsible or Multiple and add the following code to the page:

Code: Select all

 $(window).unload(function(){
	var i = 0;
	while($.removeCookie('fd_accordion-'+i)) {
		i++;
	}
});

lijupnandanan
Posts: 16
Joined: Mon Apr 11, 2016

19 Apr 2016

It seems have accordion have some other issues also.
in my scenario, suppose I have 6 accordion tabs and I have a dropdown list. I need to display accordion tabs according to this dropdown selection.
For example : Drop down Values are , dd1,dd2,dd3, dd4

For dd1 i want to visible accordion tabs 0,1,2,3,4,5,6

for dd2: tabs 0,2,3
for dd3 : tabs 0,6
for dd4 : tabs 0,4,5

My issue is that, When I select dd1 and I expand tab 4.

Then I change dd1 to dd3. Now only tab 0 and 6 are visible.

I again changed doropdown value to dd4. Now tabs 0,4 and 5 are visible. But the problem is that the 4 tab is expanded but the span class image is "ui-accordion-header-icon ui-icon ui-icon-triangle-1-e". Actually this selection image is for collapsable tab. How can I resolve this?

lijupnandanan
Posts: 16
Joined: Mon Apr 11, 2016

19 Apr 2016

How can I check an accordion tab is expanded or collapsed?

User avatar
rostislav
Moderator
Posts: 364
Joined: Mon Oct 19, 2015

19 Apr 2016

If the accordion is not set to Multiple, use the following to get the activated sections' index:

Code: Select all

$('#fd_accordion-0').accordion( "option", "active");
Regarding hiding and showing of the accordion sections - don't know how you're doing it - but I would propose you activate a different section first, and then just hide the appropriate section:

Code: Select all

$('#fd_accordion-0 .ui-accordion-header:eq(1)').hide();
Where the index of the section is specified as the argument of eq().

Locked
  • Information
  • Who is online

    Users browsing this forum: No registered users and 15 guests