Ajax表單刷新后，Primefaces commandButton不顯示對話框

Question

我需要您的幫助和指導，以解決使用Ajax刷新表單后顯示dialog的問題。 我有一個dataTable ，它顯示了許多請求，並且在commandButton視圖的onclick上將顯示一個包含一些信息的dialog 。 在dialog關閉時，將刷新表單，並且dataTable將從數據庫中獲取更新的信息。 但是，這將是第一次顯示該對話框，並通過關閉dialog刷新表單。

如果我嘗試第二次再次單擊視圖commandButton ，則commandButton將不會顯示任何對話框，並且似乎也不會執行任何操作。 即使是日志也沒有顯示任何內容。

這是我的xhtml：

<h:form id="Requests">
    <p:dataTable id="PendingRequests" var="hr" value="#{hrd.pendingRequests}"
            filteredValue="#{hrd.filteredPendingRequests}">
        <p:column headerText="Req. Date" sortBy="#{hr.requestDate}"
                filterMatchMode="contains" filterBy="#{hr.requestDate}">
            <h:outputText value="#{hr.requestDate}" />
        </p:column>
        <p:column>
            <f:facet name="header">View</f:facet>
            <p:commandButton id="submitbutton" update=":Requests:#{hr.dialogueName} "
                    oncomplete="PF('#{hr.certificateDialogue}').show()" icon="ui-icon-search"
                    title="View">
                <f:setPropertyActionListener value="#{hr}" target="#{hrd.selectedRequest}" />
            </p:commandButton>
        </p:column>
    </p:dataTable>
    <p:dialog id="CertificateDialog" header="Cert1" widgetVar="CertificateDialog">
        <p:ajax event="close" update=":Requests" listener="#{hrd.UpdateDatatable}" />
    </p:dialog>
</h:form>

該方法將在dialog onclose上調用。UpdateDatatable方法代碼為：

listPendingRequests.clear();
listPendingRequests = new ArrayList<PendingRequests>();
PreparedStatement ps = null;
String sql = "";

try {
    con = DBConn.getInstance().getConnection("jdbc/hr");

    // SQL Statement
    ps = con.prepareStatement(sql);
    ResultSet result = ps.executeQuery();
    while (result.next()) {
        PendingRequests pendingList = new PendingRequests();

        requestDate = result.getString("REQ_DT");

        pendingList.setRequestDate(requestDate);

        listPendingRequests.add(pendingList);

        RequestContext.getCurrentInstance().update("Requests");
    }
} catch (Exception e) {
    System.err.print(e);
    e.printStackTrace();
}

Answer 1

對話框在HTML DOM和JavaScript中有特殊處理。 當您仍處於同一視圖中時，永遠不要ajax更新對話框的任何父級。 否則，您可能最終會出現重復的對話框和JS中的沖突。 此外， 強烈建議您為每個對話框提供自己的形式，如<p:dialog><h:form>以避免初學者感到困惑和誤用，但是由於您希望在其上使用ajax close事件，因此您可以'請避開使用<h:form><p:dialog> 。 但是，您以相同的形式放置了其他內容，甚至對它進行了ajax更新。 這是不對的。

將表單與對話框本身聯系起來，不要在上面添加其他內容。 換句話說，拆分當前形式。

<h:form id="requests">
    <p:dataTable ...>
        ...
    </p:dataTable>
</h:form>
<h:form>
    <p:dialog ...>
        <p:ajax event="close" ... update=":requests" />
    </p:dialog>
</h:form>