Question

我正在使用PrimeFaces开发一个简单页面，列出有关某些项目的信息。我想添加一个按钮，打开一个包含详细信息的对话框。代码很简单。但它不起作用：

<h:form id="projectForm">  
  <p:dataTable id="projectDataTable" var="project" value="#{projectMB.projects}" >  
    <p:column sortBy="name" headerText="Name">  
      <h:outputText value="#{project.name}" />  
    </p:column>  
    <p:column sortBy="status" headerText="Status">  
      <h:outputText value="#{project.status}" />  
      <h:outputText value=" (#{project.progress}%)" />  
    </p:column>
    <p:column style="width:4%">  
      <p:commandButton update=":projectForm:display" id="selectButton" oncomplete="PF('projectDialog').show()" icon="ui-icon-search" title="View">  
        <f:setPropertyActionListener value="#{project}" target="#{projectMB.selectedProject}" />  
      </p:commandButton>  
    </p:column>            
  </p:dataTable>  
  <center>
    <p:commandButton id="refreshProjectsButton" actionListener="#{projectMB.refreshProjectList}" icon="ui-icon-refresh" update="projectDataTable"/>
  </center>

  <p:dialog header="Project Detail" widgetVar="projectDialog" resizable="false" id="projectDlg" showEffect="fade" modal="true">  
    <h:panelGrid id="display" columns="2" cellpadding="4" style="margin:0 auto;">  
      <h:outputText value="Name:" />  
      <h:outputText value="#{projectMB.selectedProject.name}" style="font-weight:bold"/>  
      <h:outputText value="Description:" />  
      <h:outputText value="#{projectMB.selectedProject}" style="font-weight:bold"/>  
    </h:panelGrid>  
  </p:dialog>  
</h:form>

我通过添加包含dialog的额外表单找到了解决方案：

<h:form id="projectForm">  
  <p:dataTable id="projectDataTable" var="project" value="#{projectMB.projects}" >  
    <p:column sortBy="name" headerText="Name">  
      <h:outputText value="#{project.name}" />  
    </p:column>  
    <p:column sortBy="status" headerText="Status">  
      <h:outputText value="#{project.status}" />  
      <h:outputText value=" (#{project.progress}%)" />  
    </p:column>
    <p:column style="width:4%">  
      <p:commandButton update=":projectForm2:display" id="selectButton" oncomplete="PF('projectDialog').show()" icon="ui-icon-search" title="View">  
        <f:setPropertyActionListener value="#{project}" target="#{projectMB.selectedProject}" />  
      </p:commandButton>  
    </p:column>            
  </p:dataTable>  
  <center>
    <p:commandButton id="refreshProjectsButton" actionListener="#{projectMB.refreshProjectList}" icon="ui-icon-refresh" update="projectDataTable"/>
  </center>

</h:form>  
<h:form id="projectForm2"> 

  <p:dialog header="Project Detail" widgetVar="projectDialog" resizable="false" id="projectDlg" showEffect="fade" modal="true">  
    <h:panelGrid id="display" columns="2" cellpadding="4" style="margin:0 auto;">  
      <h:outputText value="Name:" />  
      <h:outputText value="#{projectMB.selectedProject.name}" style="font-weight:bold"/>  
      <h:outputText value="Description:" />  
      <h:outputText value="#{projectMB.selectedProject}" style="font-weight:bold"/>  
    </h:panelGrid>  
  </p:dialog>  
</h:form>

我的问题是：为什么第一个代码不起作用 - 从不调用刷新java bean中的列表的方法projectMB.refreshProjectList。我在javascript和java中没有任何错误。

Answer 1

对于表单内的Dialogs来说，这是一个非常常见的问题，如果您稍微搜索一下这个问题，就可以轻松找到答案。

但也许这个答案可以帮助你进一步：

Proper Construct for Primefaces Dialog

JSF（PrimeFaces）页面不适用于单一表单

1 个答案: