ajax 表单刷新后，Primefaces commandButton 不显示对话框

Question

我需要您的帮助和指导来解决使用 ajax 刷新表单后显示 dialog 的问题。我有一个 dataTable，它显示了 commandButton 视图的一些请求和点击，将显示一个包含一些信息的 dialog。而在 dialog 的 onclose 中，表单将被刷新，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-updating 任何对话框的 parents。否则，您可能会在 JS 中遇到重复的对话框和冲突。而且， is to give each dialog its own form as in <p:dialog><h:form> to avoid confusion and misuse by starters, but as you'd like to use ajax close event on it, 改为使用 <h:form><p:dialog> 。但是，您以完全相同的形式放置了其他内容，甚至 ajax-updating 了。这是不对的。

将表单绑定到对话框本身，不要在上面放其他东西。也就是说，拆分当前表单。

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

ajax 表单刷新后，Primefaces commandButton 不显示对话框

Primefaces commandButton is not showing dialog after ajax form refresh

ajax

jsf

primefaces