CODEWITHSUNDEEP
jsf-2tabsprimefacesaccordion
KaySee
KaySee

Reputation: 423

Hiding the first tab of accordion panel in JSF Primefaces

By default the first tab of the primefaces accordion panel is shown open on page load. Is there a way that it can be closed on page load.

Thanks

Upvotes: 12

Views: 22992

Answers (6)

Sebi
Sebi

Reputation: 2584

One approach is to define a widgetVar:

<p:accordionPanel widgetVar="accordion">
    ...
</p:accordionPanel>

And then:

<body onload="PF('accordion').unselect(0)">

or for older PF versions:

<body onload="accordion.unselect(0)">

Upvotes: 7

Andrew
Andrew

Reputation: 1

Answering for PrimeFaces 6.0 users:

You can set the widgetVar property and then call PF('widgetVarValue').unselect(0); as Fred Policarpo mentioned; however, I was not able to get this to work upon accordion load, and I tried various things like using a div's onload event, using a remoteCommand with autoRun enabled, and even using custom jQuery. None of these worked for the load event, only when I ran that PF unselect call in the console.

In PrimeFaces 6.0, you can use the activeIndex attribute and set it to multiple values, e.g. "1,3,5", to close all of the tabs but open the 2nd, 4th, and 6th tabs (base 0 indexing).

Upvotes: 0

Fred Policarpo
Fred Policarpo

Reputation: 111

You can do it with the PF function, as the code below:

PF('accordionWidgetVarName').unselect(0);

Upvotes: 1

jimmybondy
jimmybondy

Reputation: 2152

None of the posted answered worked for me in PrimeFaces 3.5.x. using multiple mode, but this:

<p:accordionPanel multiple="true" activeIndex="null" ... >

Upvotes: 2

Josef
Josef

Reputation: 219

It works if you set activeIndex to blank (Primefaces 3.4.1).

<p:accordionPanel activeIndex="">

Upvotes: 7

Chriskot
Chriskot

Reputation: 647

You can just do 

<p:accordionPanel activeIndex="-1">

Upvotes: 20

Related Questions