CODEWITHSUNDEEP
jqueryjquery-uiaccordion
Salman Virk
Salman Virk

Reputation: 12307

In JQuery UI, How to know the current status ( expanded or collapsed ) of the Accordion?

I am using JQuery accordion. On click, I want to know the current status of it. How can I know it?

Upvotes: 1

Views: 4679

Answers (3)

Kamyar Gilak
Kamyar Gilak

Reputation: 1042

try this 

if($('#my_accordion h3′).hasClass('ui-state-active')) {
// accordion is open
}
else {
// accordion is closed
}

Upvotes: 3

justkt
justkt

Reputation: 14766

On the changestart (before a change) and change (after a change) event for the accordion, the callback passes the values event and ui. ui has properties newHeader, oldHeader, newContent, and oldContent containing the values of the new and old headers and contents that you can use to see what was and now is expanded. These events will happen on whatever your trigger event is for a change (click, mouseover, etc.)

Upvotes: 1

Dolan Antenucci
Dolan Antenucci

Reputation: 15942

Jquery sets a class on the active/opened accordion: "ui-state-active" vs. ".ui-state-default" (these are the classes on the Accordion demo on Jquery website: http://docs.jquery.com/UI/Accordion)

Edit: You can of course then check each accordion to see if it has the active vs. default class

Upvotes: 4

Related Questions