Panel

Panels are frames that slide in from the top, left, bottom, or right of the screen and appear over the interface.

To lazyly render the panel content and show on postback, you can make sure the open attribute is true after the postback or add success="TW('mypanel').show() to the commandButton or commandLink.

Top Panel Right Panel Bottom Panel Left Panel

Top panel

This is some content inside the top panel.

Right panel

This is some content inside the right panel.

Bottom panel

This is some content inside the bottom panel.

Left panel

This is some content inside the left panel.

Example

Documentation


<div class="grid-block">
    <a class="button" onclick="TW('topPanel').toggle()">Top Panel</a>
    <a class="button" onclick="TW('rightPanel').toggle()">Right Panel</a>
    <a class="button" onclick="TW('bottomPanel').toggle()">Bottom Panel</a>
    <a class="button" onclick="TW('leftPanel').toggle()">Left Panel</a>
</div>

<t:panel position="top" widgetVar="topPanel">
    <h2>Top panel</h2>
    <p>This is some content inside the top panel.</p>
</t:panel>

<t:panel position="right" widgetVar="rightPanel">
    <h2>Right panel</h2>
    <p>This is some content inside the right panel.</p>
</t:panel>

<t:panel position="bottom" widgetVar="bottomPanel">
    <h2>Bottom panel</h2>
    <p>This is some content inside the bottom panel.</p>
</t:panel>

<t:panel position="left" widgetVar="leftPanel">
    <h2>Left panel</h2>
    <p>This is some content inside the left panel.</p>
</t:panel>

Panels are frames that slide in from the top, left, bottom, or right of the screen and appear over the interface.

Info

Tag name	panel
Component type	io.tornadofaces.component.Panel
Renderer type	io.tornadofaces.component.PanelRenderer

Attributes

Name	Description	Required
widgetVar	Widget variable name, accessible via TW('widgetVar') and TornadoFaces.widgets.widgetVar.	false
styleClass	Styles to apply to the panel div.	false
style	CSS Styles applied to the panel div.	false
open	Set open true if you want the panel to open immediately.	false
closable	Non closable panels cannot be closed once the are opened. Default true.	false
position	Position of the window. Valid values are "top", "right", "left" and "right". Default "top".	false
rendered	Should this component be rendered?	false

Client Side API

Widget: TornadoFaces.widget.Panel

Method	Return type	Description
open	void	Shows the panel
close	void	Closes the panel
toggle	void	Open or close the panel based on current state