Accordion

accordion

The accordion component manages a stack of contentPanes using accordion handles. The attribute selectedId determines which of the panes in the stack is currently visible. All other non-selected contentPanes are hidden from view.

It's very important to understand the strategies associated with the contentPane and its parent layout components.
Please see Content Pane component wiki page.

Usage

   
<mobi:accordion id="accOne" selectedId="#{bean.selectedId}">
      <mobi:contentPane id="pane1" client="true" title="Pane 1">
         Pane 1 Content
      </mobi:contentPane>
      <mobi:contentPane id="pane2" title="Pane 2">
         Pane 2 Content
      </mobi:contentPane>
      <mobi:contentPane id="pane3" facelet="true" title="Pane 3">
         Pane 3 Content
      </mobi:contentPane>
</mobi:accordion>

Fit-to-parent (since 1.3.1)

Fixed-height

Nested Forms

Component Documentation

accordion
contentPane
accordionFormProxy (as of 1.3.1)