Hi i need some help on jsf/primefaces layout. i created 3 tabs, but the labels and text box in tab1 is not displaying.instead it is being displayed in tab2, and content of tab2 in tab3... I would like to know why am having this issue and how to solve this? Below is my createCustomer.xhtml.
NOte: the same layout i did in editCustomer.xhtml(with 3 tabs) and it works fine.
<p:panel header="#{customermsgs['customer.title']} Details" style="margin-top:10px">
<p:messages />
<h:panelGrid id="main" columns="2" styleClass="grid" columnClasses="label,value">
<p:growl id="growl" showDetail="true" />
<p:tabView id="tabView" dynamic="true">
<p:ajax event="tabChange" update=":form:growl" />
<p:tab id="tab1" title="Employer Details">
<h:panelGrid id="detail" columns="2" styleClass="grid" columnClasses="label,value">
<h:outputText
value="#{customermsgs['customer.customernumber.title']}:*" />
<h:inputText id="customer_customernumber"
value="#{CustomerComponent.customer.customernumber}"
required="true" label="customer_customernumber" />
<h:outputText
value="#{customermsgs['customer.customername.title']}:" />
<h:inputText id="customer_customername"
value="#{CustomerComponent.customer.customername}"
required="false" label="customer_customername" />
<h:outputText
value="#{customermsgs['customer.contactlastname.title']}:" />
<h:inputText id="customer_contactlastname" value="#{CustomerComponent.customer.contactlastname}"
required="false" label="customer_contactlastname" />
</h:panelGrid>
</p:tab>
<p:tab id="tab2" title="Lodging Accomodation Details">
<h:panelGrid id="detail2" columns="2" styleClass="grid" columnClasses="label,value">
<h:outputText
value="#{customermsgs['customer.contactfirstname.title']}:" />
<h:inputText id="customer_contactfirstname"
value="#{CustomerComponent.customer.contactfirstname}"
required="false" label="customer_contactfirstname" />
<h:outputText value="#{customermsgs['customer.phone.title']}:" />
<h:inputText id="customer_phone"
value="#{CustomerComponent.customer.phone}" required="false"
label="customer_phone" />
<h:outputText
value="#{customermsgs['customer.addressline1.title']}:" />
<h:inputText id="customer_addressline1"
value="#{CustomerComponent.customer.addressline1}"
required="false" label="customer_addressline1" />
</h:panelGrid>
</p:tab>
<p:tab id="tab3"
title="Clearance obtained from appropriate authorities">
<h:panelGrid id="detail3" columns="2" styleClass="grid" columnClasses="label,value">
<h:outputText
value="#{customermsgs['customer.addressline2.title']}:" />
<h:inputText id="customer_addressline2"
value="#{CustomerComponent.customer.addressline2}"
required="false" label="customer_addressline2" />
<h:outputText value="#{customermsgs['customer.city.title']}:" />
<h:inputText id="customer_city"
value="#{CustomerComponent.customer.city}" required="false"
label="customer_city" />
<h:outputText value="#{customermsgs['customer.state.title']}:" />
<h:inputText id="customer_state"
value="#{CustomerComponent.customer.state}" required="false"
label="customer_state" />
<h:outputText
value="#{customermsgs['customer.postalcode.title']}:" />
<h:inputText id="customer_postalcode"
value="#{CustomerComponent.customer.postalcode}"
required="false" label="customer_postalcode" />
<h:outputText value="#{customermsgs['customer.country.title']}:" />
<h:inputText id="customer_country"
value="#{CustomerComponent.customer.country}" required="false"
label="customer_country" />
<h:outputText
value="#{customermsgs['customer.salesrepemployeenumber.title']}:" />
<h:inputText id="customer_salesrepemployeenumber"
value="#{CustomerComponent.customer.salesrepemployeenumber}"
required="false" label="customer_salesrepemployeenumber" />
<h:outputText
value="#{customermsgs['customer.creditlimit.title']}:" />
<h:inputText id="customer_creditlimit"
value="#{CustomerComponent.customer.creditlimit}"
required="false" label="customer_creditlimit" />
</h:panelGrid>
</p:tab>
</p:tabView>
</h:panelGrid>
<h:panelGrid id="button" columns="2" styleClass="grid" columnClasses="label,value">
<h:panelGroup>
<p:commandButton image="save" ajax="false" style="margin-right:20px;" value="#{customermsgs['navigation.save']}" action="#{CustomerComponent.saveCustomer(CustomerComponent.customer)}"/>
</h:panelGroup>
</h:panelGrid>
</p:panel>