Trying to get an accordian style action when clicking the header of one section, automatically closes the other sections.
Goal is to have only one section opened at a time. Doing this in a view page / events / javascript onload.
I think I am close. Read the manual and just can't see what I am doing wrong. Any help appreciated. Here is what I have:
// Access the sections API
var sec01 = pageObj.getSection(11);
var sec02 = pageObj.getSection(21);
var sec03 = pageObj.getSection(31);
var sec04 = pageObj.getSection(41);
var sec05 = pageObj.getSection(51);
// Section 01 click
sec01.header.on('click', function(e) {
sec02.collapse();
sec03.collapse();
sec04.collapse();
sec05.collapse();
});
// Section 02 click
sec02.header.on('click', function(e) {
sec01.collapse();
sec03.collapse();
sec04.collapse();
sec05.collapse();
});
// Section 03 click
sec03.header.on('click', function(e) {
sec01.collapse();
sec02.collapse();
sec04.collapse();
sec05.collapse();
});
// Section 04 click
sec04.header.on('click', function(e) {
sec01.collapse();
sec02.collapse();
sec03.collapse();
sec05.collapse();
});
// Section 05 click
sec05.header.on('click', function(e) {
sec01.collapse();
sec02.collapse();
sec03.collapse();
sec04.collapse();
});
Have also tried:
// Access the sections API
var sec01 = pageObj.getSection(11);
var sec02 = pageObj.getSection(21);
var sec03 = pageObj.getSection(31);
var sec04 = pageObj.getSection(41);
var sec05 = pageObj.getSection(51);
// Section 01 click
sec01.header.on('click', function(e) {
sec01.expand();
sec02.collapse();
sec03.collapse();
sec04.collapse();
sec05.collapse();
});
// Section 02 click
sec02.header.on('click', function(e) {
sec01.collapse();
sec02.expand();
sec03.collapse();
sec04.collapse();
sec05.collapse();
});
// Section 03 click
sec03.header.on('click', function(e) {
sec01.collapse();
sec02.collapse();
sec03.expand();
sec04.collapse();
sec05.collapse();
});
// Section 04 click
sec04.header.on('click', function(e) {
sec01.collapse();
sec02.collapse();
sec03.collapse();
sec04.expand();
sec05.collapse();
});
// Section 05 click
sec05.header.on('click', function(e) {
sec01.collapse();
sec02.collapse();
sec03.collapse();
sec04.collapse();
sec05.expand();
});
Getting the sections id's from an inspect on the view page.