Home/ Questions/Q 568439
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-05-13T13:11:20+00:00

I’m wanted to use a panelGroup to group my inputs and their labels e.g

  • 0

I’m wanted to use a panelGroup to group my inputs and their labels

e.g

<h:panelGroup styleClass="#{jsfServicesError.errorClass}" binding="#{jsfServicesError.myComponent}">
<h:outputLabel for="company" id="companyLabel" value="#{bundle.IDENTITY_COMPANY} * :"/>
<h:inputText id="company" label="#{bundle.IDENTITY_COMPANY}" value="#{manager.uiUser.attribute.company}" required="true" styleClass="text normal">
    <f:validateLength minimum="3"/>
</h:inputText>
</h:panelGroup>

If I put some more other panelGroups after one I get as result 1 span class which includes all other inputs and labels. Is this working as intended?

Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    I created an SSCCE with Mojarra 1.2_14 on Tomcat 6.0.20:

    <%@ taglib uri="http://java.sun.com/jsf/html" prefix="h"%>
<%@ taglib uri="http://java.sun.com/jsf/core" prefix="f"%>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

<f:view>
    <html xmlns="http://www.w3.org/1999/xhtml">
        <head>
            <title>SO question 2057438</title>
        </head>
        <body>
            <h:form>
                <h:panelGroup styleClass="foo">
                    <h:outputLabel for="input1" value="label1" />
                    <h:inputText id="input1" />
                </h:panelGroup>
                <h:panelGroup styleClass="foo">
                    <h:outputLabel for="input2" value="label2" />
                    <h:inputText id="input2" />
                </h:panelGroup>
                <h:panelGroup styleClass="foo">
                    <h:outputLabel for="input3" value="label3" />
                    <h:inputText id="input3" />
                </h:panelGroup>
            </h:form>
        </body>
    </html>
</f:view>

    And the output is just as expected:

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">
    <head>
        <title>So question 2057438</title>
    </head>
    <body>
        <form id="j_id_jsp_452028652_1" name="j_id_jsp_452028652_1" method="post"
            action="/playground/test.jsf" enctype="application/x-www-form-urlencoded">
            <input type="hidden" name="j_id_jsp_452028652_1" value="j_id_jsp_452028652_1" />
            <span class="foo">
                <label for="j_id_jsp_452028652_1:input1"> label1</label>
                <input id="j_id_jsp_452028652_1:input1" type="text" name="j_id_jsp_452028652_1:input1" />
            </span>
            <span class="foo">
                <label for="j_id_jsp_452028652_1:input2"> label2</label>
                <input id="j_id_jsp_452028652_1:input2" type="text" name="j_id_jsp_452028652_1:input2" />
            </span>
            <span class="foo">
                <label for="j_id_jsp_452028652_1:input3"> label3</label>
                <input id="j_id_jsp_452028652_1:input3" type="text" name="j_id_jsp_452028652_1:input3" />
            </span>
            <input type="hidden" name="javax.faces.ViewState" id="javax.faces.ViewState" value="j_id1:j_id2" />
        </form>
    </body>
</html>

    Your problem lies somewhere else. Maybe you actually didn’t look in the generated HTML output or you expected that the multiple panelgroups would be aligned under each other. If the latter is true, then you need to add layout="block" to the h:panelGroup so that it will render a <div> instead. A HTML <div> element is by default a block element while the HTML <span> element is an inline element. Roughly said, HTML block elements like <form>, <div>, <table>, <ul>, etc implicitly adds a newline after so that any next element visually starts at a new line.

    If you’re still on the ancient JSF 1.1 or older where the h:panelGroup doesn’t have the layout attribute, then you’ll need to add CSS display: block to the class associated with the <span> element.

    • 0