Duvida no uso <h:panelGrid columns="3" > no JSF?

Front-end
#1

Olá,

no codigo abaixo está totalmente fora o label com o campo input

como poderia consertar isso na tela .

Pois aparece

Matricula um espaço em branco e depois o input …

Alguém poderia me ajudar …

abs

&lt;body&gt;
        &lt;f:view&gt;
	        &lt;h:form id="form"&gt;
		
				&lt;h:outputText value ="Cadastro de Usuário / Operador" styleClass="texto_negrito"/&gt;
                &lt;h:panelGrid columns="3" &gt;

                       &lt;h:outputText value="* Temporário"/&gt;
                       &lt;h:selectBooleanCheckbox id="temporario"  value="false" title=""  /&gt;
                       &lt;h:outputText value=""/&gt;

                       &lt;h:outputLabel value="_______________________________________________" /&gt;
                       &lt;h:outputLabel value="" /&gt;
                       &lt;h:outputLabel value="" /&gt;


                       &lt;h:outputLabel rendered="true" value="Matricula:"/&gt;   
                       &lt;h:inputText id="matriculaFunc" value="#{pubUsuario.matriculaFunc}"  required="true" requiredMessage="Digite a Matricula"/&gt;
                       &lt;h:message for="matriculaFunc"  style="color:darked"/&gt;
                       
                       

                       &lt;h:outputLabel rendered="true" value="Nome:"/&gt;   
                       &lt;h:inputText id="nomeFunc" value="#{pubUsuario.nomeFunc}"  required="true" requiredMessage="Digite o Nome"/&gt;
                       &lt;h:message for="nomeFunc"  style="color:darked"/&gt;  
                       

                       &lt;h:outputText value="Nivel:" /&gt;
                       &lt;h:selectOneMenu id="nivel" value="#{pubUsuario.nivelFunc}"
	                      rendered="true" &gt;
	                       &lt;f:selectItems value="#{pubUsuario.niveis}" /&gt;
	                   &lt;/h:selectOneMenu&gt;
                       

                       &lt;h:outputText value="Loja:" /&gt;
                       &lt;h:selectOneMenu id="loja" value="#{pubUsuario.lojaFunc}"
	                    rendered="true"&gt;
	                       &lt;f:selectItems value="#{pubUsuario.lojas}" /&gt;
	                   &lt;/h:selectOneMenu&gt;
                       

                       &lt;h:outputText value="Ativo:" /&gt;
                       &lt;h:selectOneMenu value="#{pubUsuario.ativoFunc}"&gt;   
                          &lt;f:selectItem itemValue="1" itemLabel="Sim"/&gt;   
                          &lt;f:selectItem itemValue="2" itemLabel="Não"/&gt;   
                       &lt;/h:selectOneMenu&gt;  



             &lt;/h:panelGrid&gt;

             &lt;h:commandButton value="Salvar" action="#{pubUsuario.salvar}" /&gt;
             &lt;h:commandButton value="Cancelar" action="cancelaUsuario" immediate="true" /&gt;
             &lt;h:commandButton value="Menu Principal" action="index" immediate="true" /&gt;
          &lt;/h:form&gt;
           
        
        
        &lt;/f:view&gt;
    &lt;/body&gt;
#2

Usa CSS para alinhar os componentes na grid.

#3

Tira um print da tela e hospeda em algum lugar só pra gente dar uma olhada…

Abraços

#4

Bom, se for só isso basta vc mudar o numero de colunas do seu panelGrid, como podes ver, esta com 3 por isso a desorganização, mude para 2 ou 4 que resolve, escolha sempre um numero par.

&lt;h:panelGrid columns="2" &gt;
#5

Ou entao pode usar o comando <h:column> e colocar o label e o input dentro do column, nisso voce poderia ter a quantidade de colunas impares…

Abraços

#6