Using a p:remoteCommand to update a p:dataTable

Question

Given the following XHTML code that has one <p:inputText> and a <p:dataTable> having only two columns.

<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>

When the given <p:commandButton> is pressed, the associated listener submitAction() is invoked and finally the <p:dataTable> is updated by <p:remoteCommand> only if validations succeed.

After doing this, if a row held by the given <p:dataTable> is updated (which in turn, updates <p:panel id="panel"> via <p:ajax> inside <p:dataTable>. It is sometimes necessary), the given <p:inputText> in <p:panel id="panel"> causes validation its borders turn red implying violating the associated validation that should not happen.

If <p:remoteCommand> is removed and the given <p:commandButton> is changed like as follows,

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

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

and the update attribute is changed from update="panel" to update="panel dataTable" then, the <p:inputText> does not cause validations, when a row in <p:dataTable> is updated.

How to prevent <p:inputText> from performing validations, when a row in <p:dataTable> is updated using <p:ajax> which, in turn updates <p:panel> holding the <p:inputText> in question?

<p:remoteCommand> itself in this case, cannot be omitted. It is necessary to update <p:dataTable> only if no validations are violated. Otherwise, costly business services are executed unnecessarily, even though there are validation error(s).

---

The associated JSF managed bean (though completely unnecessary).

@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

After doing this, if a row held by the given <p:dataTable> is updated (which in turn, updates <p:panel id="panel"> via <p:ajax> inside <p:dataTable>. It is sometimes necessary), the given <p:inputText> in <p:panel id="panel"> causes validation its borders turn red implying violating the associated validation that should not happen.

This isn't what is happening. If that were true, you'd have seen 3 HTTP requests in the network monitor. But there are only 2 (one from the submit of the panel and one from the <p:remoteCommand>).

The cause is the <p:remoteCommand> itself. Its process attribute defaults to @all ("whole view"). You can also confirm this by inspecting the javax.faces.partial.execute request parameter in the network monitor. It says @all. In other words, the entire form is also submitted/processed, including those empty inputs.

You need to explicitly set it to @this:

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