Updating a form in primefaces when a selection is made in the datatable

I have a prime panel to display employee information and a datatable next to it, the datatable is getting populated and I am tyring to update the panel with that employee information when a row is selected. I am using dataTable and onRowSelect is getting the information that I want from the Backing bean but I can never get the inputtext fields to populate???
This is the page:

<?xml version='1.0' encoding='UTF-8' ?>
<!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"
      xmlns:ui="http://java.sun.com/jsf/facelets"
      xmlns:p="http://primefaces.prime.com.tr/ui"
      xmlns:f="http://java.sun.com/jsf/composite">

<h:head>
        <title>Add Employee</title>
    </h:head>
    <h:body>
        <ui:composition template="./WEB-INF/templates/mainTableTemplate.xhtml">

<ui:define name="top">
                top
            </ui:define>

<ui:define name="left">
                <p:menu type="sliding" maxHeight="125">
                    <p:submenu label="Employees">
                        <p:menuitem value="Add" url="./addEmployee.xhtml" icon="ui-icon ui-icon-home"/>
                        <p:menuitem value="Edit" url="./editEmployee.xhtml" />
                        <p:menuitem value="View" url="./viewEmployees.xhtml" />
                    </p:submenu>

<p:submenu label="Schedule">

<p:menuitem value="View" url="./faces/viewSchedule.xhtml" />
                    </p:submenu>

</p:menu>

</ui:define>

<ui:define name="content">
                <h:form>
                    <p:growl id="growl" showDetail="true" />
                    <p:panel header="Employee Information" widgetVar="employeePanel">
                        
                        <h:panelGrid columns="4" id="lastNamePanel">

<h:outputText value="Last Name: *" />
                            <p:inputText value="#{listEmployeeBean.selectedEmployee.lastName}" required="true" label="last" id="last"/>

<h:outputText value="First Name: *" />
                            <p:inputText value="#{listEmployeeBean.selectedEmployee.firstName}" required="true" label="First Name"/>

<h:outputText value="Email: *" />
                            <p:inputText value="#{employeeBean.emailAddress}" required="true" label="Email Address"/>

<h:outputText value="Password: *" />
                            <p:password value="#{employeeBean.password}" feedback="true" required="true" label="Password" minLength="6" />
                        </h:panelGrid>
                        <HR></HR>
                        <h:panelGrid columns="4">
                            <h:outputText value="SSN: *" />
                            <p:inputMask value="#{employeeBean.ssn}" required="false" label="Social Security Number" mask="999-99-9999"/>

<h:outputText value="DOB: *" />
                            <p:calendar value="#{employeeBean.dob}" navigator="true" required="true" label="Date Of Birth" yearRange="1909" />

<h:outputText value="Hire Date: *" />
                            <p:calendar value="#{employeeBean.hireDate}" required="true" label="Hire Date"/>

<h:outputText value="Term Date: *" />
                            <p:calendar value="#{employeeBean.termDate}" required="false" label="Term Date"/>
                        </h:panelGrid>
                        <h:panelGrid columns="2">

<h:outputText value="Hours In Work Week: *" />
                            <p:inputText value="#{employeeBean.workHoursPerWeek}" required="true" label="Work Hours Per Week" size="5"/>

</h:panelGrid>
                        <HR></HR>
                       <h:panelGrid columns="4">
                            <h:outputText value="Phone 1: *" />
                            <p:inputMask value="#{employeeBean.phone1}" required="true" label="Phone 1" mask="(999)-999-9999"/>

<h:outputText value="Phone 2: *" />
                            <p:inputMask value="#{employeeBean.phone2}" required="false" label="Phone 2" mask="(999)-999-9999"/>

<h:outputText value="Cell Phone: *" />
                            <p:inputMask value="#{employeeBean.cellPhone}" required="false" label="Cell Phone" mask="(999)-999-9999"/>

</h:panelGrid>
                        <HR></HR>
                        <h:panelGrid columns="2">
                            <h:outputText value="Address 1: * " />
                            <p:inputText value="#{employeeBean.address1}" required="true" label="Address1" size="56"/>
                            <h:outputText value="Address 2: * " />
                            <p:inputText value="#{employeeBean.address2}" required="true" label="Address2" size="56"/>
                        </h:panelGrid>

<h:panelGrid columns="4">
                            <h:outputText value="City: *" />
                            <p:inputText value="#{employeeBean.city}" required="true" label="City"/>

<h:outputText value="State: *" />
                            <p:inputText value="#{employeeBean.state}" required="true" label="State" size="3"/>
                            <h:outputText value="Zip Code: *" />
                            <p:inputText value="#{employeeBean.zipCode}" required="true" label="Zipcode"/>

<h:outputText value="" />
                            <h:outputText value="" />

</h:panelGrid>

<f:facet name="complete">
                                    <h:outputText value="" />
                                </f:facet>
                            </p:ajaxStatus-->
                        </h:panelGrid>
                    </p:panel>

</h:form>
            </ui:define>

<ui:define name="right">
                <h:form>
                    <p:dataTable var="employee" value="#{listEmployeeBean.employees}" paginator="true" rows="10"
                             selection="#{listEmployeeBean.selectedEmployee}" selectionMode="single"
                             rowSelectListener="#{listEmployeeBean.onRowSelect}"
                             
                             id="employeeInfo"
                             onRowSelectUpdate="lastNamePanel"
                             dblClickSelect="false">

<f:facet name="header">
                        Select a row to see the employee detail
                    </f:facet>
                    <p:column>
                        <f:facet name="header">
                            <h:outputText value="Last Name"/>
                        </f:facet>
                        <h:outputText value="#{employee.lastName}"/>
                    </p:column>

<p:column>
                        <f:facet name="header">
                            <h:outputText value="First Name"/>
                        </f:facet>
                        <h:outputText value="#{employee.firstName}"/>
                    </p:column>
                    </p:dataTable>
                </h:form>
                
            </ui:define>

<ui:define name="bottom">
                bottom
            </ui:define>

</ui:composition>
    </h:body>
</html>

And this is my backing bean:

About 10 times a week I see someone on here or somewhere else who have multiple forms on a single
page and every time they're in trouble.

Use one form with prependId="false" and everything will start to become a lot simpler. Read up about
naming containers also.

Brendan.

Right and never mind separating concerns like putting parameters and returned data in separate forms.
While we're at it lets get rid of templates too. Just put everything in one page.

Why should primeFaces force me to stuff everything into one form? If it would not break this feature then maybe you wouldn't see this 10 times a week. It's not our fault PF breaks it.

Other frameworks work perfectly with multiple forms.

Hi David, my response was probably a little unhelpful, although I was genuinely trying to assist. I
stand by my original comment in that the use of multiple forms, whilst permissible (when not nested)
tends to cause more problems than it solves. I think it unlikely that PrimeFaces is causing the
problems you're experiencing, although there are some idiosynchracies related to referring to
component ids from within a p:datatable (i.e. you have to use form:compid when you otherwise
wouldn't need to). If you are still experiencing problems perhaps we could try and narrow down the
problem with a minimalist code structure?

Regards,
Brendan.

please tell me i have two form and cant update the command button whic is disable in form 2.i try alot but cant find a solution my code is below.

<h:form id="FamilyInfo">

<h:panelGrid columns="6" cellpadding="7" cellspacing="2"
id="grid3" columnClasses="a,b,c,d"
rowClasses="plainRow,shadedRow">

<h

utputLabel value="Marital Status : " class="field-title" />
<p:selectOneMenu required="true" id="maritalstatus"
value="#{personalInfoBean.maritialStatusPerson}">
<f:selectItem itemLabel="Select Maritial Status"></f:selectItem>
<f:selectItem itemLabel="Single" itemValue="Single" />
<f:selectItem itemLabel="Married" itemValue="Married" />
<f:selectItem itemLabel="Widower" itemValue="Widower" />
<f:selectItem itemLabel="Divorce" itemValue="Divorce" />

<p:ajax event="blur" update="msg36" />
<p:ajax event="change" update="childaddbtn"
listener="#{personalInfoBean.handleStatusChange}" />
</p:selectOneMenu>

<p:message for="maritalstatus" id="msg36" display="icon" />
<h

utputLabel value=" " class="field-title" />
<h

utputLabel value=" " class="field-title" />

<h

utputLabel value="Name next of Kin : " class="field-title" />
<p:inputText
value="#{personalInfoBean.hrNextOfKin.nameNextOfKin}"
required="true" id="nok">
<p:ajax event="blur" update="msg37" />
<f:validateLength minimum="3" maximum="15"></f:validateLength>
</p:inputText>
<p:message for="nok" id="msg37" display="icon" />
<h:commandButton value="Save" action="#personalInfoBean.saveHrNOK}" class="defaultButton" />

</h:form>

<h:form id="nokChildForm">

<p:dialog header="Children" widgetVar="dlgchild" id="childDlg">

<h:panelGrid columns="3" cellpadding="5">
<h

utputLabel value="Name : " />
<p:inputText value="#{personalInfoBean.nokChild.childrenName}"
required="true" id="chlname">
<p:ajax event="blur" update="msgchld" />
<f:validateLength minimum="3" maximum="25"></f:validateLength>
</p:inputText>
<p:message for="chlname" id="msgchld" display="icon" />

<h

utputLabel value="Gender :" />
<p:selectOneMenu id="chldgender" required="true"
value="#{personalInfoBean.nokChild.childrenGender}">
<f:selectItem itemLabel="Select Gender" itemValue="" />
<f:selectItem itemLabel="Male" itemValue="Male" />
<f:selectItem itemLabel="Female" itemValue="Female" />
<p:ajax event="blur" update="msgchldGnd" />
</p:selectOneMenu>
<p:message for="chldgender" id="msgchldGnd" display="icon" />

<h

utputLabel value="Age :" />
<p:inputText value="#{personalInfoBean.nokChild.childrenAge}"
required="true" id="chldage">
<p:ajax event="blur" update="msgchldage" />
<f:validateLength minimum="1" maximum="3"></f:validateLength>
</p:inputText>
<p:message for="chldage" id="msgchldage" display="icon" />

<f:facet name="footer">
<p:commandButton value="Save" update="nokChildList"
oncomplete="handleAddChildrenRequest(xhr, status, args)"
actionListener="#{personalInfoBean.setNOKChild}" />
</f:facet>
</h:panelGrid>

<div style="padding-left: 950px; padding-top: 28px">

<p:commandButton disabled="#{personalInfoBean.addButtonChildren}" value="Add Children" id="childaddbtn" onclick="dlgchild.show()"/></div>

<h:commandButton value="Save" action="#{personalInfoBean.saveHrNOK}" class="defaultButton" />

</h:form>

when i change dropdown of from one the button on second form should be enabled by default that button is disabled how i do it.this button is not getting enabled when i change the dropdown
<p:commandButton disabled="#{personalInfoBean.addButtonChildren}" value="Add Children" id="childaddbtn" onclick="dlgchild.show()"/>