Accordion [examples]

Hiding and showing accordion sections

To switch between different accordion sections just issue a select action on the section:

Lianja.showDocument("page:mypagename.mysection?action=select")

Hiding and showing Accordion Stack sections

An accordion stack is a group of sections where only one section from the accordion is visible at a time but no headers are visible. Check the Stacked behavior at runtime page attribute to specify that the sections should be displayed as an accordion stack. This is typically used in conjunction with a navigation panel but may be used independently to provide you with the ability to switch between the sections contained within a page arranged as an accordion.

Lianja.showDocument("page:mypagename.mysection?action=select")

https://www.lianja.com/doc/index.php/Understanding_Lianja_UI_Navigation

 

---

 

Accordion

Q:
I’ve a page using Accordion, with 5 section.
I’ve enabled and configured the Navigation panel and all work fine.
I need to add a simple section (with “Exclude from accordion” option = true) that becomes visible only when I activate a specific section…
A:
A page laid out as accordion sections only allows one section to be expanded at a time and any at the top that are excluded from the accordion. What you are trying to achieve cannot be done with an accordion as it will expand the selected section into the available space.
The only thing a page laid out in accordion sections allows is exclude at the top (for a header section) and then expand one section into the available space. Any attempts to hide or show sections that are part of the accordion will have unpredictable results.
A2:
Remove the accordion and manually control the sections.
Like so

Code:

Lianja.showDocument("section:section2?action=collapse")
Lianja.showDocument("section:section2?action=expand")

If you have 4 sections, and you want 2 to be expanded, you can code for that.
If you want only one to be expanded, and the rest collapsed, that will work too.
Using this code, you can create your own accordion.

---

Taking the Accordion one step further. Using the click event to move records in related sections.
Also added a nice transition to hide and show the accordion.
[HerbTube] “Lianja AccordionTransition” https://youtu.be/ADghbexFir4

Accordion

You have the Page ‘Hide actionbar’ attribute set to False, but when you deploy your App to the Web Client no bar is shown at the bottom of the Page?

Check that the Section attribute ‘Hide form Navbar’ is set to False. In the screenshot below, it is set to True, so the bar will be hidden at runtime.

‘Hide form Navbar’ should only be set to True when you are using ‘Stacked accordions’, where you show individual sections from one page as if they were separate pages.

The main section would have the actionbar/navbar showing; other sections wouldn’t and would have ‘Hide form Navbar’ set to True.

Accordion

Oh, and the other Page Attribute that applies to Accordions – ‘Stacked behaviour at runtime‘ – is the one demonstrated in the example_webapp and example_tabletui Apps. That is to display one Section at a time, without the other Section headers. It’s ideal for tablets and other small displays. The Navigation Panel (navigation_menu.txt) allows you to select an individual Section.

---

‘Accordion behavior‘ means always display as an Accordion. ‘Use Accordions‘ means display as an Accordion when the display is less than the height set in ‘Use Accordions height‘.

---

It would be expand/collapse. I think you need to check for the activesection and collapse that first, then expand the section you want.

oactiveSection = Lianja.get("mypage").activesection
oactiveSection.collapse()
Lianja.get("mypage.mysection").expand()

---

Q:
I want to have a page with multiple section but I need the main section (top most) to be always open
The rest of the sections can be opened one at a time in accordion style.
So at any time, user can see at most 2 open sections in my page
A: