formColumn - Form Layout Column

Divides a form table or a layout row into columns.

Category

Extension Library

Syntax

<xe:formColumn attributes>content</xe:formColumn>
Table 1. Essential properties
Property Description
id Defaults to formColumn1, formColumn2, and so on.
colSpan Spans columns starting at the current column. The default 1 means no span, and 0 means span to the last column.
Table 2. All properties
Category Properties
basics binding, colSpan, id, loaded, rendered, rendererType
styling disableTheme, style, styleClass, themeId

Examples

This example displays a table with two columns each with one row containing an edit box. The effect is to display the edit boxes on one line. A header provides explanatory text and a footer provides save and cancel buttons.
<xe:formTable id="formTable1" formTitle="Subject and number"
formDescription="Provide your input in the boxes below.">
	<xe:formColumn>
		<xe:formRow id="formRow1" label="Subject" for="inputText1">
		<xp:inputText id="inputText1"
			value="#{document1.subject}">
		</xp:inputText>
		</xe:formRow>
	</xe:formColumn>
	<xe:formColumn>
		<xe:formRow id="formRow2" label="Number" for="inputText2">
		<xp:inputText id="inputText2"
			value="#{document1.number}">
		</xp:inputText>
		</xe:formRow>
	</xe:formColumn>
	<xp:this.facets>
		<xp:panel xp:key="footer" id="panel1">
			<xp:button value="Save" id="button1">
				<xp:eventHandler event="onclick" submit="true"
					refreshMode="complete" immediate="false" save="true">
				</xp:eventHandler>
			</xp:button>
			<xp:button value="Cancel" id="button2">
				<xp:eventHandler event="onclick" submit="true"
					refreshMode="complete" immediate="true" save="false">
				</xp:eventHandler>
			</xp:button>
		</xp:panel>
	</xp:this.facets>
</xe:formTable>