Developing Web 2.0 applications
with JavaServerFaces
and Dreamweaver
>> Just Became Easier
Documentation
Search
  1. Introduction
  2. Getting Started
  3. Developing Web Sites
  4. Using Components
  5. Internationalization
  6. Code View Support
  7. Design View Support
  8. Keyboard Shortcuts
  9. Tag Object Toolbars
  10. JSF Server Behaviors
  11. Property Inspectors
  12. JSF Tag Reference
JSF HTML Tag Library
  h:body
  h:button
  h:column
  h:commandButton
  h:commandLink
  h:dataTable
  h:form
  h:graphicImage
  h:head
  h:inputHidden
  h:inputSecret
  h:inputText
  h:inputTextarea
  h:link
  h:message
  h:messages
  h:outputFormat
  h:outputLabel
  h:outputLink
  h:outputScript
  h:outputStylesheet
  h:outputText
  h:panelGrid
Selected h:panelGroup
  h:selectBooleanCheckbox
  h:selectManyCheckbox
  h:selectManyListbox
  h:selectManyMenu
  h:selectOneListbox
  h:selectOneMenu
  h:selectOneRadio
If you like this documentation, please take a look at my book:

12. JSF HTML Tag Reference

Documentation > JSF > JSF Tag Reference > JSF HTML Tag Library > h:panelGroup

h:panelGroup

The panelGroup tag is a container component that renders its child components. It is intended to be used in situations where it is desirable to include several components but when only one child component is allowed, such as within a panelGrid column or a facet component. The example below demonstrates the use of a panelGroup component to nest two components inside a single panelGrid column.

Without the panelGroup component, the two child components of the panelGrid would have been rendered in separate rows.

JSF Example

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
	"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" 
      xmlns:h="http://java.sun.com/jsf/html">
<h:head>
	<h:outputStylesheet library="styles" name="style.css" />
</h:head>
<body>
<h:form id="form">
	<h:panelGrid id="grid" columns="1">
		<h:panelGroup>
			<h:outputLabel value="#{messages.usernameLabel} " />
			<h:inputText label="#{messages.usernameLabel}" id="username" 
			             value="#{userController.user.username}" required="true" />
			<h:message for="username" errorClass="error" />
		</h:panelGroup>
		<h:panelGroup>
			<h:outputLabel value="#{messages.passwordLabel} " />
			<h:inputSecret label="#{messages.passwordLabel}" id="password" 
			             value="#{userController.user.username}" required="true" />
			<h:message for="password" errorClass="error" />
		</h:panelGroup>
		<h:commandButton id="submit" value="#{messages.submitLabel}" />
	</h:panelGrid>
</h:form>
</body>
</html>
This example was formatted by JSFToolbox for Dreamweaver.

Rendered Output

Rendered h:panelGroup tag

HTML Output

<table id="form:grid">
  <tbody>
    <tr>
      <td>
        <label>Username</label>
        <input id="form:username" type="text" name="form:username" />
      </td>
    </tr>
    <tr>
      <td>
        <label>Password </label>
        <input id="form:password" type="password" name="form:password" value="" />
      </td>
    </tr>
    <tr>
      <td><input type="submit" name="form:submit" value="Submit" /></td>
    </tr>
  </tbody>
</table>

Tag Attributes

binding Expression
 
The value-binding expression linking this component tag to a backing bean property.
id Text
 
The unique identifier value for this component. The value must be unique within the closest naming container.
layout Text
 
The type of layout markup to use when rendering this group. If the value is "block" the renderer must produce an HTML "div" element. Otherwise HTML "span" element must be produced.
rendered Boolean
 
A value-binding expression that evaluates to a Boolean condition indicating if this component should be rendered.
style Text
 
The style attribute sets the CSS style definition to be applied to this component when it is rendered.
styleClass Text
 
The styleClass attribute sets the CSS class to apply to this component when it is rendered.