user994694
user994694

Reputation: 133

Open one accordion panel when multiple accordions on the page

How do I get the attached fiddle to open the active accordion only? The catch is i need to have two or more instances of the accordion. For example if an accordion is open in #course_accordion_1 and the user clicks to open an accordion in #course_accordion_2 I want the active accordion in #course_accordion_1 to close.

http://jsfiddle.net/X74U6/29/

$( "#course_accordion_1,#course_accordion_2" ).accordion({
    active: false,
    collapsible: true,
    change: function(event, ui) { 
       if(ui.newHeader.length > 0){
          // open
           console.log("open")
       } else {
          // closed
           console.log("closed");

       }
    }
});

Upvotes: 0

Views: 452

Answers (1)

A J
A J

Reputation: 2140

Check this fiddle

$(function() {
    var $accordions = $(".course_accordion").accordion({
        collapsible: true,
        active: false,
        icons: false
    }).on('click', function() {
        $accordions.not(this).accordion('activate', false);
    });
});

Upvotes: 1

Related Questions