java - 脏检查 : JSF + Primefaces application?

Question

我有一个 Web 应用程序，我在其中使用 JSF + Primefaces 作为 UI。在使用 AJAX 调用(如对数据表的 rowSelect 事件的 AJAX 调用)时，我在网页上应用脏检查时遇到困难。

以下是我想通过 AJAX 调用应用脏检查的确切场景。以下是我在网页中使用的组件。

1) 我有一个数据表，由名为“companyBean”的 bean 填充(具有公司属性)

<p:dataTable id="basic" var="company" value="#{companyInfoBean.companyList}" 
    rowKey="#{company.id}"
    selection="#{companyInfoBean.selectedCompany}" selectionMode="single">

    <p:ajax event="rowSelect" update=":customerDataForm:customerDataFields" />

    <p:column id="modelHeader">
        <f:facet name="header">
            <h:outputText value="Company Name" />
        </f:facet>
        <h:outputText value="#{company.companyName}" />
    </p:column>
      more columns....
</p:dataTable>

如上所示，在所选行上(AJAX 调用)我更新页面底部表单中的值

<h:form id="customerDataForm">
<p:panel id="customerDataFields">
<p:panelGrid >
<p:row>
    <p:column>
        <h:outputLabel for="companyname" value="Company Name " />
    </p:column>
    <p:column>
        <p:inputText id="companyname" value="#{companyInfoBean.selectedCompany.companyName}" label="Company Name" />
    </p:column>
         more columns...
  <p:row>
    <p:column colspan="2" style="text-align:right">
        <p:commandButton value="Save" actionListener="#{companyInfoBean.updateCompany}" 
        update=":customerDataForm:customerDataTable"/>
    </p:column>
    <p:column colspan="2" style="text-align:left">
        <p:commandButton value="Undo" />
    </p:column>
</p:row>

在上面的表单中，用户可以编辑在数据表的 rowSelect 上更新的值。

现在我想对数据表上 rowSelection 上的表单进行脏检查，即尽管执行了 rowSelect 的 AJAX 调用，但如果用户使用的表单上有一些未保存的更改会被提示。

基本上我可以从这个场景中理解.. 我需要一些基于条件的 AJAX 调用而不是直接调用。或者我必须使用一些 jQuery 东西来实现脏检查。

Answer 1

您可以通过不同的方式实现这一点。这里有一些(如果弹出窗口没问题，我更喜欢方法 3):

方法一:

a) 使用 selectedCompany 的副本，例如 editCompanyBean 作为支持 用于客户数据字段的 bean。
b) 为ajax事件添加一个“监听器” 这可以在设置之前检查 editCompanyBean 的空值 这与 selectedCompany 的值(value)观。如果失败，你可以咆哮 消息并阻止复制。 注意:您可以使用覆盖开关来覆盖 (b)
c) 在保存 editCompanyBean 时将其初始化为 null 字段值。

方法二:

a) 在 selectedCompany 的 set 语句中检查 bean 是否已经填充了值。如果填充并跳过编辑，则抛出警告消息。
b) 让用户在继续之前点击 customerDataFields 上的保存或重置。
注意:每次保存或重置 customerDataFields 后清除 selectedCompany

方法三:

a) 将 customerDataFields 放入模态弹出对话框中。将其设置为用户必须在继续之前保存或重置。
b) ajax 事件将弹出上面的模态对话框。您也可以使用按钮弹出。