我目前正在使用 JSF2.0 制作一个 Facelets 页面,并且我正在使用 Primefaces 让它看起来很漂亮:D。但是我有一个我似乎无法解决的问题。我的页面背后的想法如下:我有一个仪表板页面,其中包含不同的手风琴选项卡,并且在每个选项卡中都有一个 primefaces 数据表。在该数据表中是给定用户的一些行。但是当我想在我的数据表中添加一个新行时,我使用以下方法。我的数据表下方有一个“添加行”按钮,当我单击它时,我通过 JQuery 将页面加载到按钮下方的 div 中。在那个 div 中,我的“addrow”页面加载了验证等等。
但问题是:当我单击包含页面上的添加按钮时,我想更新“父”页面中的数据表,因此包含我的添加页面的页面,这不能作为更新属性我的 p:commandButton 似乎在我的父页面上找不到数据表或任何其他组件。
因此,如果有人可以告诉我如何更新父页面中的组件?
这是相关的代码片段: 父页面(包括“内容div”中的添加页面)
<f:view contentType="text/html" beforePhase="#{userBean.retrievePersonalInformation}">
<h:outputText value="#{companyBean.companyName}" id="test2"/>
<h:form id="form" prependId="false">
<p:accordionPanel autoHeight="true" effect="bounceslide" id="accordion">
<p:tab title="Personal information">
<h:panelGrid columns="2" cellpadding="10">
<h:outputText
value="Welkom #{loginBean.username}"/><br/>
<h:outputText value="#{bundle.name}"/>
<h:outputText value="#{userBean.lastName}"/>
<h:outputText value="#{userBean.street}"/>
<h:outputText value="#{userBean.zipCode}"/>
<h:outputText value="#{userBean.city}"/>
<h:outputText value="#{userBean.cellPhone}"/>
<h:outputText value="#{userBean.phone}"/>
<h:outputText value="#{userBean.email}"/>
<h:outputText value="#{userBean.dateOfBirth}"/>
<h:outputText value="#{userBean.gender}"/>
<h:outputText value="training: #{userBean.trainingName}"/>
</h:panelGrid>
</p:tab>
<p:tab title="My studies">
<h:panelGrid columns="2" cellpadding="10">
<h:outputText value="My studies"/>
</h:panelGrid>
</p:tab>
<p:tab title="My job history">
<h:panelGrid columns="2" cellpadding="10">
<h:outputText value="My Job history"/>
</h:panelGrid>
</p:tab>
<p:tab title="My Technologies">
<h:panelGrid columns="2" cellpadding="10">
<h:outputText value="My Technologies"/>
</h:panelGrid>
</p:tab>
<p:tab title="My language skills">
<h:panelGrid columns="2" cellpadding="10">
</h:panelGrid>
</p:tab>
<p:tab title="My Certificates">
<h:panelGrid columns="2" cellpadding="10">
<input type="button" id="btnCertificate" value="show me"/>
</h:panelGrid>
</p:tab>
<p:tab title="My Trainings">
<h:panelGrid columns="2" cellpadding="10">
<p:dataTable var="training" value="#{trainingBean.trainingsByUser}" id="trainingTable"
emptyMessage="No trainings found with given criteria" paginator="true"
rows="10"
paginatorTemplate="{CurrentPageReport} {FirstPageLink} {PreviousPageLink} {PageLinks} {NextPageLink} {LastPageLink} {RowsPerPageDropdown}"
rowsPerPageTemplate="5,10,15">
<p:column headerText="Training name" sortBy="#{training.name}"
filterBy="#{training.name}" filterMatchMode="contains"
style="width: 100px;">
<h:outputText value="#{training.name}"/>
</p:column>
<p:column headerText="Training date" sortBy="#{training.trainingDate}"
filterBy="#{training.trainingDate}" filterMatchMode="contains"
style="width: 100px;">
<h:outputText value="#{training.trainingDate}"/>
</p:column>
<p:column headerText="Training description" sortBy="#{training.description}"
filterBy="#{training.description}" filterMatchMode="contains"
style="width: 100px;">
<h:outputText value="#{training.description}"/>
</p:column>
</p:dataTable>
</h:panelGrid>
</p:tab>
<p:tab title="My Companies">
<p:dataTable value="#{companyBean.companiesByUser}" var="company" id="companyTable"
emptyMessage="No companies found for given user" paginator="true" rows="10"
paginatorTemplate="{CurrentPageReport} {FirstPageLink} {PreviousPageLink} {PageLinks} {NextPageLink} {LastPageLink} {RowsPerPageDropdown}"
rowsPerPageTemplate="5,10,15">
<p:column headerText="name" sortBy="#{company.companyName}"
filterBy="#{company.companyName}"
filterMatchMode="contains"
style="width: 100px;">
<h:outputText value="#{company.companyName}"/>
</p:column>
<p:column headerText="Start date" sortBy="#{company.startDate}"
filterBy="#{company.startDate}"
filterMatchMode="contains"
style="width: 100px;">
<h:outputText value="#{company.startDate}">
<f:convertDateTime pattern="dd/MM/yyyy" type="date" timeZone="CET"/>
</h:outputText>
</p:column>
<p:column headerText="End date" sortBy="#{company.endDate}"
filterBy="#{company.endDate}"
filterMatchMode="contains"
style="width: 100px;">
<h:outputText value="#{company.endDate}">
<f:convertDateTime pattern="dd/MM/yyyy" type="date" timeZone="CET"/>
</h:outputText>
</p:column>
<p:column>
<p:commandButton id="btnEditCompany" value="Edit company" action="#{companyBean.navigateUser}" oncomplete="showCertificateEdit()">
<f:setPropertyActionListener value="#{company}" target="#{companyBean.selectedCompany}"/>
</p:commandButton>
</p:column>
</p:dataTable>
<input type="button" id="btnAddCompany" value="Add company"/>
</p:tab>
</p:accordionPanel>
</h:form>
<div id="content">
</div>
</f:view>
添加页面
<f:view contentType="text/html">
<ui:composition>
<h:form id="companyForm" prependId="false">
<h:message for="name"/>
<h:message for="startdate"/>
<h:message for="enddate"/>
<h:outputText class="label" value="name: "/>
<h:inputText id="name" styleClass="inputtext validate[required]"
value="#{companyBean.companyName}"/>
<h:outputText class="label" value="start date: "/>
<h:inputText id="startdate" styleClass="inputtext validate[required]"
value="#{companyBean.startDate}">
<f:convertDateTime pattern="dd/MM/yyyy"/>
</h:inputText>
<h:outputText class="label" value="end date: "/>
<h:inputText id="enddate" styleClass="inputtext validate[required]"
value="#{companyBean.endDate}">
<f:convertDateTime pattern="dd/MM/yyyy"/>
</h:inputText>
<h:outputText class="label" value="type: "/>
<h:selectOneMenu styleClass="input" value="#{companyBean.type}">
<f:selectItem itemValue="0" itemLabel="Internal"/>
<f:selectItem itemValue="1" itemLabel="External"/>
</h:selectOneMenu>
<h:commandButton action="cancel" value="cancel" immediate="true"/>
<p:commandButton id="btnAddCompanyTest" actionListener="#{companyBean.addCompany}" value="Add company" ajax="false"/>
</h:form>
</ui:composition>
</f:view>
jQuery加载方法
jQuery("#btnAddCompany").click(function() {
jQuery("#content").load('/user/companyDetail.xhtml',function(){
jQuery("#companyForm").validationEngine('attach', {promptPosition : "topRight", scroll: false});
});
});
支持bean添加方法
public String addCompany() {
FacesContext facesContext = FacesContext.getCurrentInstance();
try {
companyService.addCompany(companyName, startDate, endDate, type);
loadCompanyList();
} catch (cvApplicationException e) {
facesContext.addMessage("companyForm", new FacesMessage(e.getMessage()));
}
return "../user/dashboard.xhtml?faces-redirect=true";
}
我的 backingBean 是 sessionscoped。
提前致谢