DashboardPane

Overview

Since 4.3

The ace:dashboardPane component defines one of the panes of an ace:dashboard. It can include a header and a footer and an arbitrary number of child components and markup. It can also be resized, moved and closed.

See the ICEfaces Showcase Live Demo of this component, complete with source code.

Getting Started

An ace:dashboardPane component can be defined as follows.

        <h:form id="form">
		<ace:dashboard id="dashboard">
			<ace:dashboardPane headerText="Header" row="1" column="1" sizeY="2" sizeX="3" closable="true">
				<h:outputText value="Pane content." />
			</ace:dashboardPane>
		</ace:dashboard>
        </h:form>

Attributes

TagLib Documentation
This section covers attributes involved in the typical use-cases for this component. For reference, the complete taglib documentation for this component is available here.

maxColumns The maximum number of columns to allow in the dashboard. Valid values range from 1 to 100. Any other value will be treated as 100.

row The 1-relative row position of this pane. If set to 0, it will be given the next available horizontal position that is not already occupied by a pane with specific row and column values. If this pane overlaps with the position of another pane, this or the other pane will be automatically moved to a more appropriate available space. This value will be automatically updated as the pane changes position in the client, either directly or indirectly, by the dragStop, resize and close ajax events. The default value is 0.

column The 1-relative column position of this pane. If set to 0 or if the value is greater than 'maxColumns' in the parent dashboard component, it will be given the next available horizontal position that is not already occupied by a pane with specific row and column values. If this pane overlaps with the position of another pane, this or the other pane will be automatically moved to a more appropriate available space. This value will be automatically updated as the pane changes position in the client, either directly or indirectly, by the dragStop, resize and close ajax events. The default value is 0.

sizeX The horizontal size of this pane as the number columns it occupies. The default value is 1.

sizeY The vertical size of the pane as the number of rows it occupies. The default value is 1.

closable Specifies whether this pane can be closed or not. If true, a close button will be rendered at the upper right corner of the pane header. The default value is false.

headerText The text to render in the header of the pane. If no header text is specified and no header facet is defined, the header will not be rendered.

footerText The text to render in the footer of the pane. If no footer text is specified and no footer facet is defined, the header will not be rendered.

Client Behavior Events

dragStop	Fired when the pane is dragged and dropped by the user.	org.icefaces.ace.event.DashboardDragStopEvent
resize	Fired when the pane is resized by the user.	org.icefaces.ace.event.DashboardResizeEvent
close	Fired when the pane is closed by the user.	org.icefaces.ace.event.CloseEvent

JavaScript APIs

See the same section for ace:dashboard.

Keyboard and ARIA Support

Ability to tab through the close buttons as well as button roles for them.

Known Issues

None at the momeny