使用 p:remoteCommand 更新 p:dataTable

Question

给定以下XHTML代码，该代码具有一个<p:inputText>和一个只有两列的<p:dataTable>。

<p:remoteCommand name="updateTable" update="dataTable"/>
<p:panel id="panel">
    <p:inputText id="txtValue" value="#{testManagedBean.txtValue}"
                 required="true"/>
    <p:message for="txtValue" showSummary="false"/>
    <p:commandButton actionListener="#{testManagedBean.submitAction}"
                     oncomplete="if(!args.validationFailed) {updateTable();}" 
                     update="panel" value="Submit"/>
</p:panel>
<p:panel id="dataTablePanel" header="Data">
    <p:dataTable id="dataTable" var="row" value="#{testManagedBean}"
                 lazy="true"
                 pageLinks="10"
                 editable="true"
                 rowsPerPageTemplate="5,10,15"
                 rows="10"
                 rowKey="#{row.catId}"
                 editMode="row">
        <p:ajax event="rowEdit" update=":form:panel dataTable"
                listener="#{testManagedBean.onRowEdit}"/>
        <p:column id="id" headerText="Id">
            <h:outputText value="#{row.catId}"/>
        </p:column>
        <p:column id="catName" headerText="Category">
            <p:cellEditor>
                <f:facet name="output">
                    <h:outputText value="#{row.catName}"/>
                </f:facet>
                <f:facet name="input">
                    <p:inputText value="#{row.catName}" label="Category">
                        <f:validateLength minimum="2" maximum="45"/>
                    </p:inputText>
                </f:facet>
            </p:cellEditor>
        </p:column>
        <p:column headerText="Edit" width="100">
            <p:rowEditor/>
        </p:column>
    </p:dataTable>
</p:panel>

按下给定的<p:commandButton>时，将调用关联的侦听器submitAction()，最后，仅当验证成功时，<p:remoteCommand>才会更新<p:dataTable>。

执行此操作后，如果更新给定<p:dataTable>持有的行(这反过来又通过<p:dataTable>内部的<p:ajax>更新<p:panel id="panel">。有时有必要(，<p:panel id="panel">中的给定<p:inputText>导致验证，其边框变为红色，这意味着违反了不应发生的相关验证。

如果删除<p:remoteCommand>并更改给定<p:commandButton>，如下所示，

<p:commandButton actionListener="#{testManagedBean.submitAction}"
                 update="panel dataTable" value="Submit"/>

删除oncomplete="if(!args.validationFailed) {updateTable();}"

并且update属性从update="panel"更改为update="panel dataTable"，然后，当<p:dataTable>中的行更新时，<p:inputText>不会导致验证。

当<p:dataTable>中的行使用<p:ajax>更新时，如何防止<p:inputText>执行验证，而<p:panel>保留相关<p:inputText>更新？

在这种情况下，<p:remoteCommand>本身不能省略。仅当未违反验证时，才需要更新<p:dataTable>。否则，即使存在验证错误，也会不必要地执行成本高昂的业务服务。

---

关联的 JSF 管理的 Bean(尽管完全没有必要(。

@ManagedBean
@ViewScoped
public final class TestManagedBean extends LazyDataModel<Category> implements Serializable
{
    @EJB
    private final CategoryBeanLocal categoryService = null;
    private String txtValue;  //Getter and setter.
    private static final long serialVersionUID = 1L;
    @Override
    public List<Category> load(int first, int pageSize, List<SortMeta> multiSortMeta, Map<String, Object> filters) {
        setRowCount(categoryService.rowCount().intValue());
        return categoryService.getList(first, pageSize, multiSortMeta, filters);
    }
    public void submitAction() {
        System.out.println("txtValue : " + txtValue);
        txtValue = null;
    }
    public void onRowEdit(RowEditEvent event) {
        System.out.println("onRowEdit() called.");
    }
}

Answer 1

完成此操作后，如果给定<p:dataTable>持有的行被更新(反过来，通过 <p:dataTable> 内部的<p:ajax>更新<p:panel id="panel">。有时有必要(，<p:panel id="panel">中的给定<p:inputText>导致验证，其边框变为红色，暗示违反了不应发生的相关验证。

这不是正在发生的事情。如果这是真的，您将在网络监视器中看到 3 个 HTTP 请求。但是只有 2 个(一个来自小组提交，一个来自<p:remoteCommand>(。

原因是<p:remoteCommand>本身。其process属性默认为 @all("整个视图"(。您还可以通过在网络监视器中检查javax.faces.partial.execute请求参数来确认这一点。它说@all.换句话说，整个表单也会被提交/处理，包括那些空输入。

您需要将其显式设置为 @this ：

<p:remoteCommand name="updateTable" process="@this" update="dataTable"/>