ajax tabPanel reRender only works on tab 1
I've got a tabPanel enclosed in an a4j:form, as shown below:
<a4j:form id="interviewform">
<a4j:jsFunction status="majorstatus" name="makeDirty" ajaxSingle="true" limitToList="true" reRender="atinterviewreg">
<a4j:actionparam name="param1" assignTo="#{IntakeOffenderBean.isDirty}" />
</a4j:jsFunction>
<h:inputHidden value="#{DOPIntakeAdminTechInterviewBean.reInit}"></h:inputHidden>
<table cellpadding="0" cellspacing="0">
<tr>
<td align="center">
<a4j:outputPanel id="atinterviewreg" ajaxRendered="true">
<a4j:commandButton status="savestatus" id="saveButton" value="Save Interview" oncomplete="javascript:showErrors();" actionListener="#{DOPIntakeAdminTechInterviewBean.saveInterview}" reRender="atinterviewreg,panelerrors" rendered="#{IntakeOffenderBean.isDirty}"/>
<a4j:status forceId="true" id="savestatus" onstart="Richfaces.showModalPanel('saveprogressmp',{width:450, top:200})" onstop="Richfaces.hideModalPanel('saveprogressmp')" />
<rich:spacer height="16px" width="100px" rendered="#{!IntakeOffenderBean.isDirty}"></rich:spacer>
</a4j:outputPanel>
</td>
</tr>
</table>
<rich:spacer height="4px"></rich:spacer>
<rich:tabPanel id="admintechinterviewtabs" style="width: 96%;" binding="#{DOPIntakeAdminTechInterviewBean.adminTechTabs}">
<rich:tab id="identification" switchType="ajax" status="majorstatus" label="Identification" actionListener="#{DOPIntakeAdminTechInterviewBean.newTabSelected}">
<ui:include id="identificationview" src="\interviewidentification.xhtml"/>
</rich:tab>
<rich:tab id="family" switchType="ajax" status="majorstatus" label="Family" actionListener="#{DOPIntakeAdminTechInterviewBean.newTabSelected}">
<ui:include id="familyview" src="\interviewfamily.xhtml"/>
</rich:tab>
<rich:tab id="demographics" switchType="ajax" status="majorstatus" label="Demographics" actionListener="#{DOPIntakeAdminTechInterviewBean.newTabSelected}">
<ui:include id="demographicsview" src="\blankpage.xhtml"/>
</rich:tab>
<rich:tab id="educationjobs" switchType="ajax" status="majorstatus" label="Education/Employment" actionListener="#{DOPIntakeAdminTechInterviewBean.newTabSelected}">
<ui:include id="educationjobsview" src="\blankpage.xhtml"/>
</rich:tab>
<rich:tab id="stg" switchType="ajax" status="majorstatus" label="STG" actionListener="#{DOPIntakeAdminTechInterviewBean.newTabSelected}">
<ui:include id="stgview" src="\blankpage.xhtml"/>
</rich:tab>
<rich:tab id="criminalhistory" switchType="ajax" status="majorstatus" label="Criminal History" actionListener="#{DOPIntakeAdminTechInterviewBean.newTabSelected}">
<ui:include id="criminalhistoryview" src="\blankpage.xhtml"/>
</rich:tab>
<rich:tab id="complete" switchType="ajax" status="majorstatus" label="Mark Complete" actionListener="#{DOPIntakeAdminTechInterviewBean.newTabSelected}">
<ui:include id="completeview" src="\blankpage.xhtml"/>
</rich:tab>
</rich:tabPanel>
<h:inputHidden id="maximumSeverity" rendered="#{! empty facesContext.maximumSeverity}" value="#{facesContext.maximumSeverity.ordinal}" />
</a4j:form>
<rich:modalPanel id="editparentmp" minHeight="500" minWidth="600" height="500" width="600" zindex="2000" left="200">
<f:facet name="header">
<h:outputText value="Edit Mother" />
</f:facet>
<f:facet name="controls">
<h:graphicImage value="/images/close.png" style="cursor:pointer" onclick="Richfaces.hideModalPanel('editparentmp')" />
</f:facet>
<ui:include src="\parentedit.xhtml"/>
</rich:modalPanel>
Everything works perfectly on tab 1 where I can make ajax calls and reRender portions of the content shown in interviewidentification.xhtml (the included facelet on tab 1). I have similar actions being performed on tab 2, but none of the reRenders work. I really need the tabPanel to work in ajax mode, as I am doing such things as preventing the user from going to aanother tab if the data has been changed on the current tab. I also like the ability to tie the a4j:status to the tab changes so the user knows that something is happening. Why does the reRender not work on any other tab than tab 1?
Below is the code from the facelet included on tab 2:
<rich:panel id="intfampanel" style="width: 650px; height: 276px; overflow: auto;">
<rich:spacer height="10px"></rich:spacer>
<div class="lineDiv">
<div class="lineText"><h:outputText value="Mother's History" styleClass="stdLabel"/></div>
<div class="lineLabel"><rich:separator></rich:separator></div>
</div>
<rich:spacer height="10px"></rich:spacer>
<div class="lineDiv">
<div class="lineValue">
<table>
<tr>
<td align="left"><h:outputText value="What is/was your Mother's name?" styleClass="stdLabel"/></td>
<td align="left">
<a4j:outputPanel id="motherinfo" ajaxRendered="true">
<a4j:commandButton rendered="#{!IntakeOffenderBean.motherPresent}" value="Add Mother" limitToList="true" reRender="editparent" actionListener="#{DOPIntakeAdminTechInterviewBean.selectMother}" oncomplete="javascript:Richfaces.showModalPanel('editparentmp',{width:450, top:200});editparentmpShowComplete();">
<a4j:actionparam name="reRender" value="motherinfo, motherdeclbl, motherdec" assignTo="#{IntakeMenuBean.reRender}"/>
</a4j:commandButton>
<h:outputText id="mothersName" value="#{IntakeOffenderBean.mother.associateName}" rendered="#{IntakeOffenderBean.motherPresent}" styleClass="stdLabel"/>
</a4j:outputPanel>
</td>
</tr>
<tr>
<td align="left">
<a4j:outputPanel id="motherdeclbl" ajaxRendered="true">
<h:outputText value="Is your Mother still living?" styleClass="stdLabel" rendered="#{IntakeOffenderBean.motherPresent}"/>
</a4j:outputPanel>
</td>
<td align="left">
<a4j:outputPanel id="motherdec" ajaxRendered="true">
<h:selectOneRadio rendered="#{IntakeOffenderBean.motherPresent}" id="motherLiving" onclick="makeDirty(true);" value="#{IntakeOffenderBean.mother.isLiving}" styleClass="stdLabel">
<f:selectItem id="livingyes" itemLabel="Yes" itemValue="true" />
<f:selectItem id="livingno" itemLabel="No" itemValue="false" />
</h:selectOneRadio>
</a4j:outputPanel>
</td>
</tr>
</table>
</div>
<div style="position: absolute; right: 6px; height: 24px; top: -10px;">
<a4j:outputPanel id="parguardcomm" ajaxRendered="true">
<a4j:commandButton rendered="#{!IntakeOffenderBean.parentGuardianBackgroundCommentsPresent}" image="/images/documentempty.gif" ajaxSingle="true" limitToList="true" reRender="editcomment" actionListener="#{DOPIntakeAdminTechInterviewBean.newParentGuardianBackgroundComment}" oncomplete="javascript:Richfaces.showModalPanel('editcommentmp',{width:450, top:200});editcommentmpShowComplete();">
<a4j:actionparam name="reRender" value="parguardcomm" assignTo="#{IntakeMenuBean.reRender}"/>
</a4j:commandButton>
<a4j:commandButton rendered="#{IntakeOffenderBean.parentGuardianBackgroundCommentsPresent}" image="/images/documentpresent.gif" ajaxSingle="true" limitToList="true" reRender="editcomment" actionListener="#{DOPIntakeAdminTechInterviewBean.updateParentGuardianBackgroundComment}" oncomplete="javascript:Richfaces.showModalPanel('editcommentmp',{width:450, top:200});editcommentmpShowComplete();">
<a4j:actionparam name="reRender" value="parguardcomm" assignTo="#{IntakeMenuBean.reRender}"/>
</a4j:commandButton>
</a4j:outputPanel>
</div>
</div>
<rich:spacer height="30px"></rich:spacer>
</rich:panel>
Essentially, on tab 2, I press the Add Mother button, which opens the modal panel on the parent facelet called editparentmp. This modal panel includes the facelet shown below:
<ui:composition xmlns="http://www.w3.org/1999/xhtml"
xmlns:ui="http://java.sun.com/jsf/facelets"
xmlns:h="http://java.sun.com/jsf/html"
xmlns:f="http://java.sun.com/jsf/core"
xmlns:a4j="http://richfaces.org/a4j"
xmlns:rich="http://richfaces.org/rich">
<a4j:form id="editparentform">
<a4j:outputPanel ajaxRendered="true" id="editparent">
<table width="100%" align="center">
<tr>
<td colspan="6" align="center">
<h:outputText value="##{IntakeOffenderBean.offenderID} #{IntakeOffenderBean.offenderName}" styleClass="stdLabel" />
</td>
</tr>
<tr>
<td align="right">
<h:outputText value="Relation: " styleClass="stdLabel" />
</td>
<td align="left" colspan="5">
<h:outputText id="relation" value="#{CodeCacheBean.getCodeDescription$['CMRELCD'][AssociateBean.associateType]}" styleClass="stdLabel"/>
</td>
</tr>
<tr>
<td align="right">
<h:outputText value="Name: " styleClass="stdLabel" />
</td>
<td align="left" colspan="5">
<h:inputText normalStyleClass="stdTextBox" errorStyleClass="stdTextBoxError" warnStyleClass="stdTextBoxWarn" id="parentName" label="Name" required="true" value="#{AssociateBean.associateName}" maxlength="30" size="35" styleClass="stdTextBox">
<f:validator validatorId="fullNameValidator" />
</h:inputText>
</td>
</tr>
<tr>
<td align="right">
<h:outputText value="Address: " styleClass="stdLabel" />
</td>
<td align="left" colspan="5">
<h:inputText normalStyleClass="stdTextBox" errorStyleClass="stdTextBoxError" warnStyleClass="stdTextBoxWarn" id="parentAddress" label="Address" required="true" value="#{AssociateBean.residenceAddress}" maxlength="25" size="30" styleClass="stdTextBox"/>
</td>
</tr>
<tr>
<td align="right">
<h:outputText value="City: " styleClass="stdLabel" />
</td>
<td align="left">
<h:inputText normalStyleClass="stdTextBox" errorStyleClass="stdTextBoxError" warnStyleClass="stdTextBoxWarn" id="parentCity" label="City" required="true" value="#{AssociateBean.residenceCity}" maxlength="13" size="16" styleClass="stdTextBox"/>
</td>
<td align="right">
<h:outputText value="State: " styleClass="stdLabel" />
</td>
<td align="left">
<h:selectOneMenu label="State" id="stateCombo" required="true" value="#{AssociateBean.residenceState}">
<f:selectItems value="#{CodeCacheBean.getASICodes$['STATEID'][true]}"/>
</h:selectOneMenu>
</td>
<td align="right">
<h:outputText value="Zip: " styleClass="stdLabel" />
</td>
<td align="left">
<h:inputText normalStyleClass="stdTextBox" errorStyleClass="stdTextBoxError" warnStyleClass="stdTextBoxWarn" id="parentZip" label="Zip" required="false" value="#{AssociateBean.residenceZip}" maxlength="5" size="7" styleClass="stdTextBox"/>
</td>
</tr>
<tr>
<td align="right">
<h:outputText value="County (if NC): " styleClass="stdLabel" />
</td>
<td align="left" colspan="5">
<h:selectOneMenu label="County" id="countyCombo" required="false" value="#{AssociateBean.residenceCounty}">
<f:selectItems value="#{CodeCacheBean.getASICodes$['CDCOARAG'][true]}"/>
</h:selectOneMenu>
</td>
</tr>
<tr>
<td align="right">
<h:outputText value="Country: " styleClass="stdLabel" />
</td>
<td align="left" colspan="5">
<h:selectOneMenu label="County" id="countryCombo" required="true" value="#{AssociateBean.residenceCountry}">
<f:selectItems value="#{CodeCacheBean.getASICodes$['CMBCNTRY'][true]}"/>
</h:selectOneMenu>
</td>
</tr>
<tr>
<td align="right">
<h:outputText value="Phone: " styleClass="stdLabel" />
</td>
<td align="left" colspan="5">
<h:inputText normalStyleClass="stdTextBox" errorStyleClass="stdTextBoxError" warnStyleClass="stdTextBoxWarn" id="parentPhone" label="Phone" required="false" value="#{AssociateBean.phoneNumber}" maxlength="10" size="15" styleClass="stdTextBox"/>
</td>
</tr>
<tr>
<td align="right">
<h:outputText value="Age: " styleClass="stdLabel" />
</td>
<td align="left">
<h:inputText normalStyleClass="stdTextBox" errorStyleClass="stdTextBoxError" warnStyleClass="stdTextBoxWarn" id="parentAge" label="Age" required="false" value="#{AssociateBean.ageAtReferenceDate}" maxlength="3" size="6" styleClass="stdTextBox"/>
</td>
<td align="right">
<h:outputText value="As of Date: " styleClass="stdLabel" />
</td>
<td align="left" colspan="3">
<rich:calendar label="As of Date" mode="client" enableManualInput="true" id="ageAsOfDate" datePattern="MM/dd/yyyy" required="true" value="#{AssociateBean.ageReferenceDate}"/>
</td>
</tr>
<tr>
<td align="left" colspan="6">
<h:selectBooleanCheckbox id="notifyEmerg" value="#{AssociateBean.emergencyNotification}"/><h:outputText value="Notify in case of emergency?"/>
</td>
</tr>
<tr>
<td align="left" colspan="6">
<h:selectBooleanCheckbox id="rearingParent" value="#{AssociateBean.offenderRearingIndividual}"/><h:outputText value="Offender reared by this person?"/>
</td>
</tr>
</table>
<center>
<table>
<tr>
<td>
<a4j:commandButton value="Save" limitToList="true" actionListener="#{DOPIntakeAdminTechInterviewBean.saveParent}" oncomplete="windowclose();" reRender="parenterrors,#{IntakeMenuBean.reRender}">
<a4j:actionparam name="refresh" value="true" assignTo="#{IntakeMenuBean.refresh}"/>
</a4j:commandButton>
</td>
</tr>
</table>
</center>
<center>
<table>
<tr>
<td>
<a4j:outputPanel id="parenterrors">
<h:inputHidden id="maximumSeverity" rendered="#{! empty facesContext.maximumSeverity}" value="#{facesContext.maximumSeverity.ordinal}" />
<rich:messages id="error" layout="list" styleClass="stdLabel">
<f:facet name="errorMarker">
<h:graphicImage value="/images/failed.gif" />
</f:facet>
</rich:messages>
</a4j:outputPanel>
</td>
</tr>
</table>
</center>
</a4j:outputPanel>
</a4j:form>
<script>
function windowclose(){
// alert("severity:" + document.all('editparentform:maximumSeverity'));
if (document.all('editparentform:maximumSeverity')==null) {
Richfaces.hideModalPanel('editparentmp');
}
}
function editparentmpShowComplete() {
window.setTimeout(
function() {
document.all('editparentform:parentName').focus();
document.all('editparentform:parentName').select();
}, 100);
}
</script>
</ui:composition>
When finished adding the mother's information, I press the Save button, which reRenders the errors (if any) as well as 3 a4j:outputPanels on the facelet included in tab 2. If there are no errors, the 3 outputPanels should reRender, but they don't. I have employed this exact same mechanism in the content included in tab 1, and it works perfectly.
WHY IS THIS HAPPENING!!! HELP!!
I am using RichFaces 3.1.4GA
facelets 1.1.12
JSF 1.2 Sun implementation