1-Feb-06 (Created: 1-Feb-06) | More in 'Java Server Faces'

JSF: Sample code for using datatable tags

Simple data table


<h:dataTable 
	value="#{backingbean.somelistclass}" 
	var="rowobjectRef"
	id="dataTable">

	<!-- Column: selected column: 0 -->
	<h:column>
		<f:facet name="header">
			<h:outputText value="Columnn1" />
		</f:facet>
		<h:outputText value="#{rowobjectRef.field1}" />
	</h:column>
	
	<!-- Column: agency name: 1 -->
	<h:column>
		<f:facet name="header">
			<h:outputText value="Column2" />
		</f:facet>
		<h:outputText value="#{rowobjectRef.field1}" />
	</h:column>
</h:dataTable>

Table with styles


<h:dataTable 
	styleClass="grid_results"
	headerClass="grid_results_header"
	columnClasses="column1Class,column2Class,column3Class"
	value="#{backingbean.somelistclass}" 
	var="rowobjectRef"
	id="dataTable">

	<!-- Column: selected column: 0 -->
	<h:column>
		<f:facet name="header">
			<h:outputText value="Columnn1" />
		</f:facet>
		<h:outputText value="#{rowobjectRef.field1}" />
	</h:column>
</h:dataTable>

Table with column attributes


<h:dataTable 
	value="#{backingbean.somelistclass}" 
	var="rowobjectRef"
	id="dataTable">

	<!-- Column: selected column: 0 -->
	<h:column>
		<f:facet name="header">
			<h:outputText value="Columnn1" />
		</f:facet>
		<h:outputText value="#{rowobjectRef.field1}" />
		<f:attribute value="center" name="align" />
		<f:attribute value="middle" name="valign" />
	</h:column>
</h:dataTable>

Table with multiple controls in a cell


<h:dataTable 
	value="#{backingbean.somelistclass}" 
	var="rowobjectRef"
	id="dataTable">

	<!-- Column: selected column: 0 -->
	<h:column>
		<f:facet name="header">
			<h:outputText value="Columnn1" />
		</f:facet>
		
		<h:outputText value="#{rowobjectRef.field1}" />
		
		<h:graphicImage styleClass="graphicImage" 
			id="SelectedImageId"
			rendered="#{rowObjectRef.selected}"
			url="/images/star_blue.gif">
		</h:graphicImage>
		
		<h:selectOneListbox id="rolebox" size="1"
			value="#{rowObjectRef.selectedValue}">
			<f:selectItems value="#{rowObjectRef.selectItemList}" />
		</h:selectOneListbox>
		
		<hx:commandExButton action="#{rowObjectRef.onContinue}"
			type="submit" value="Go" styleClass="button"
			id="button1"></hx:commandExButton>
			
		<f:attribute value="center" name="align" />
		<f:attribute value="middle" name="valign" />
	</h:column>
</h:dataTable>