panelGrid resizes after logn failure
[nobr]I am working on a simple login form, that requires a username and a password. Both fields are set as required = true . The problem is that if I ommit entering a value, then the page is redrawn with the panel having almost three times the initial width.
Since I am fairly new on web applications, I don't know of a way similar to the classic debugging of Desktop applications that allows you inspect every single attribute. Is there some way to find out what happens?
Posting some of the code too.
<f:view>
<h:form>
<h:panelGrid columns="2" border ="10">
<t:div style="width: 150px" >
<h:outputLabel styleClass="lbl1" value="#{ptext.Username}" />
</t:div>
<t:div style="width: 150px" >
<h:inputText styleClass="inp1" id="username" value="#{user.username}" required="true" >
<h:message for="username" styleClass="errorText" />
</h:inputText>
</t:div>
<t:div style="width: 150px" >
<h:outputLabel styleClass="lbl1" value="#{ptext.Password}" />
</t:div>
<t:div style="width: 150px" ><h:inputSecret styleClass="inp1" id="password" value="#{user.password}" required="true" ><h:message for="password" styleClass="errorText" />
</h:inputSecret>
</t:div>
<t:div style="width: 150px" >
<h:commandButton value="#{ptext.Login}" action="#{login.login}" styleClass="cmd1" />
</t:div>
</h:panelGrid>
<f:verbatim>
<br />
</f:verbatim>
<h:panelGroup>
</h:panelGroup>
<t:div style="width: 150px" >
<h:commandButton value="Update Base" action="#{login.updBase}"
rendered="false" immediate="true" styleClass="cmd1" />
</t:div>
<h:messages globalOnly="true" styleClass="errorText" />
</h:form>
</f:view>
[/nobr]
