This topic is locked

Opening and closing sections on click

4/23/2026 06:42:00
PHPRunner General questions
D
DealerModules authorDevClub member

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.