我正在使用Primefaces,我想在调用灯箱并关闭它后刷新数据表?
<h:form id="form">
<p:growl id="msgs" />
<fieldset>
<legend>La liste du Materiel </legend>
<p:outputPanel id="Materiels">
<p:dataTable id="datatablemat"
value="#{materielBean2.materiellist}"
var="materielu"
rowKey="#{materielu.filtrageDate}"
widgetVar="polesTable"
emptyMessage="pas de materiel pour cette salle"
autoUpdate="true"
filteredValue="#{materielBean.filteredmateriel}"
paginator="true" rows="5"
paginatorTemplate="{CurrentPageReport} {FirstPageLink} {PreviousPageLink} {PageLinks} {NextPageLink} {LastPageLink} {RowsPerPageDropdown}"
rowsPerPageTemplate="5,10,15" paginatorPosition="bottom"
style="width:100%;height:300px">
<!-- Partie de la recherche -->
<f:facet name="header">
<p:outputPanel>
<h:outputText value="Search all fields:" />
<p:inputText id="globalFilter" onkeyup="polesTable.filter()"
style="width:150px" />
</p:outputPanel>
</f:facet>
<p:column sortBy="#{materielu.materiel.matCode}"
filterBy="#{materielu.materiel.matCode}" filterStyle="display:none"
headerText="Code Materiel">
<h:outputText value="#{materielu.materiel.matCode}" />
</p:column>
<p:column sortBy="#{materielu.materiel.matDesignation}"
filterBy="#{materielu.materiel.matDesignation}" filterStyle="display:none"
headerText="Désignation Materiel">
<h:outputText value="#{materielu.materiel.matDesignation}" />
</p:column>
<p:column sortBy="#{materielu.materiel.matPrix}"
filterBy="#{materielu.materiel.matPrix}" filterStyle="display:none"
headerText="Prix Materiel">
<h:outputText value="#{materielu.materiel.matPrix}" />
</p:column>
<p:column sortBy="#{materielu.filtrageDate}"
filterBy="#{materielu.filtrageDate}" filterStyle="display:none"
headerText="Date de mise en oeuvre Materiel">
<h:outputText value="#{materielu.filtrageDate}" />
</p:column>
<p:column sortBy="#{materielu.materiel.categorie.catDesignation}"
filterBy="#{materielu.materiel.categorie.catDesignation}" filterStyle="display:none"
headerText="Catégorie Materiel">
<h:outputText value="#{materielu.materiel.categorie.catDesignation}" />
</p:column>
<p:column>
<span>
<p:commandButton icon="ui-icon-folder-collapsed"
action="#{materielBean2.setSelectedMaterielView(materielu.materiel)}"
process="@this"
update=":form:view"
oncomplete="materielDialogview.show()"
>
</p:commandButton>
</span>
</p:column>
<p:column>
<p:lightBox iframe="true" width="700px" height="500px" widgetVar="gdl#{materielu.materiel.materielId}" id="ss#{materielu.materiel.materielId}">
<h:outputLink value="add.xhtml" title="gdl#{materielu.materiel.materielId}">
<p:commandButton icon="ui-icon-pencil" id="bt#{materielu.materiel.materielId}"
action="#{materielBean2.setSelectedMateriel(materielu.materiel)}"
process="@this"
>
</p:commandButton>
</h:outputLink>
</p:lightBox>
</p:column>
<p:column>
<p:commandButton icon="ui-icon-trash" title="Supprimer" oncomplete="" process="">
</p:commandButton>
</p:column>
<f:facet name="footer">
Total #{fn:length(materielBean2.materiellist)} enregistrements.
</f:facet>
</p:dataTable>
这是:add.xhtml:
<h:form id="formm" >
<p:panel id="panel" header="edit :" style="margin-bottom:10px;width :600px">
<h:panelGrid id="edit" columns="2" cellpadding="4"
style="margin:0 auto;">
<f:facet name="header">
<p:messages id = "message"></p:messages>
</f:facet>
<h:outputText value="Designation materiel :" />
<p:inputText id="designation" required="true" value="#{materielBean2.selectedMateriel.matDesignation}" />
<h:outputText value="Prix materiel :" />
<pe:inputNumber id="Input1" required="true" value="#{materielBean2.prixmat}">
</pe:inputNumber>
<h:outputText value="Date d'aquisition du materiel :" />
<p:calendar pattern="dd-MM-yyyy" required="true" timeZone="UTC" value="#{materielBean2.dateAquis}" showButtonPanel="true" navigator="true" locale="pt" id="Date_aquiss" >
</p:calendar>
<h:outputText value="Date de mise en service du materiel :" />
<p:calendar pattern="dd-MM-yyyy" required="true" timeZone="UTC" value="#{materielBean2.dateMise}" showButtonPanel="true" navigator="true" locale="pt" id="Date_mise_en_servicee" >
</p:calendar>
<h:outputText value="Date d'entree à l'invetaire :" />
<p:calendar pattern="dd-MM-yyyy" required="true" timeZone="UTC" value="#{materielBean2.dateInventaire}" showButtonPanel="true" navigator="true" locale="pt" id="Date_inventaire" >
</p:calendar>
<h:outputLabel value="Famille materiel : *" for="famillee" style="font-weight:bold;margin-right:14px;"></h:outputLabel>
<p:selectOneMenu id="famillee" value="#{materielBean2.famille}" required="true" >
<f:selectItem itemLabel="Select famille" itemValue="" />
<f:selectItems value="#{materielBean2.familles}" />
<p:ajax event="change" update="categori"
listener="#{materielBean2.categorieChange}" />
</p:selectOneMenu>
<h:outputText value="Catégorie materiel :" />
<p:selectOneMenu id="categori" value="#{materielBean2.categorie}" required="true">
<f:selectItem itemLabel="Select categories" itemValue="" />
<c:forEach items="#{materielBean2.categories}" var="c">
<!-- >c:if test="#{materielBean2.famille == c.famille.famId}"-->
<f:selectItem itemValue="#{c.catId}" itemLabel="#{c.catDesignation}" />
<!-- ->/c:if-->
</c:forEach>
<p:ajax event="change" update="categori"
listener="#{materielBean2.categorieChange}" />
</p:selectOneMenu>
<h:outputText value="Marque materiel :" />
<p:selectOneMenu id="marque" value="#{materielBean2.marque}" required="true">
<f:selectItem itemLabel="Select Marque" itemValue="" />
<f:selectItems value="#{materielBean2.marques}" />
</p:selectOneMenu>
<h:outputText value="Pole materiel :" />
<p:selectOneMenu id="p#{i}" value="#{materielBean2.pole}" required="true" >
<f:selectItem itemLabel="Select Pole" itemValue="" />
<f:selectItems value="#{materielBean2.poles}" />
<p:ajax event="change" update="salless"
listener="#{materielBean2.salleChange}" >
</p:ajax>
</p:selectOneMenu>
<h:outputText value="Salle materiel :" />
<p:selectOneMenu id="salless" value="#{materielBean2.salle}" required="true" >
<f:selectItem itemLabel="Select Salle" itemValue="" />
<f:selectItems value="#{materielBean2.salles2}" />
</p:selectOneMenu>
</h:panelGrid>
<div class="clearboth"></div>
</p:panel>
<p>
<p:commandButton id="btn_add" value="Valider"
action="#{materielBean2.addMateriel}" update="@form" style="margin-top:30px;margin-left:2px;"
>
</p:commandButton>
</p>
</h:form>
数据表在我使用时更新:
`RequestContext context = RequestContext.getCurrentInstance();
context.execute("parent.location.reload(true)");`
但它重新加载了所有页面,我想重新加载数据表。
答案 0 :(得分:2)
您需要连接到onHide
客户端回调,这是<p:lightBox>
标记的属性,以便在灯箱关闭时捕获事件。从JS函数中,您可以调用,例如<p:remoteCommand>
来更新您想要的内容。
扩展的基本示例:
<p:lightBox onHide="remote()"...>
....
</p:lightBox>
<p:dataTable id="datatable" ...>
<p:remoteCommand name="remote" update="datatable"/>
基本上这里发生的事情如下:(a)关闭灯箱,(b)remote()
调用JS函数,(c)通过AJAX更新标识为datatable
的元素。