[OmniFaces utilities 2.2] Update the row of the given UIData component at the given zero-based row index in tables with pagination

Before reading this post is recommended to read the Update the row of the given UIData component at the given zero-based row index.
You may be also interested in: Update the row of the given UIData component at the given zero-based row index with support for nested UIData

---

[OmniFaces utilities] The updateRow() method updates the row of the given UIData component at the given zero-based row index. This will basically update all direct children of all UIColumn components at the given row index.

Note that the to-be-updated direct child of UIColumn must be a fullworthy JSF UI component which renders a concrete HTML element to the output, so that JS/ajax can update it. So if you have due to design restrictions for example a <h:panelGroup rendered="..."> without an ID, then you should give it an ID. This way it will render a <span id="..."> which is updateable by JS/ajax.

---

Method:

Usage:

Let's suppose that we have a table that supports pagination, like the following PrimeFaces Data Table:

<p:dataTable var="t" value="#{playersBean.players}"
                     binding="#{playersTable}"

                     rows="5"

                     paginator="true"

                     paginatorTemplate="{CurrentPageReport}  {FirstPageLink} {PreviousPageLink} {PageLinks} 
                                        {NextPageLink} {LastPageLink} {RowsPerPageDropdown}"

                     rowsPerPageTemplate="5,10,15">

 <p:column headerText="Player">

  <h:panelGroup id="playerId">#{t.player}</h:panelGroup>

 </p:column>

 <p:column headerText="Age">

  <h:panelGroup id="ageId">#{t.age}</h:panelGroup>

 </p:column>

 <p:column headerText="Birthplace">

  <h:panelGroup id="birthplaceId">#{t.birthplace}</h:panelGroup>

 </p:column>

 <p:column headerText="Residence">

  <h:panelGroup id="residenceId">#{t.residence}</h:panelGroup>

 </p:column>

 <p:column headerText="Height">

  <h:panelGroup id="heightId">#{t.height} cm</h:panelGroup>

 </p:column>

 <p:column headerText="Weight">

  <h:panelGroup id="weightId">#{t.weight} kg</h:panelGroup>

 </p:column>

</p:dataTable>

This will produce a table like in figure below - there are two pages and each page has 5 rows (rows with indexes from 0 to 9):

In OmniFaces 2.1, the utility method Ajax#updateRow() works only for rows from the first page, which means that if we try to update the first (or any other row from the first page) and the last (or any other row from the second page) rows, only the first row (or any other specified row from the first page) will be updated:

<f:ajax>

 <!-- this will work as expected -->

 <h:commandButton value="Update First Row"             

                  action="#{playersBean.updateRow(playersTable, 0)}" />

 <!-- this will not work as expected -->

 <h:commandButton value="Update Last Row"

                  action="#{playersBean.updateRow(playersTable, 9)}" />                          

</f:ajax>

The PlayersBean is available here.

The result of trying to update first and last rows will be:

Starting with OmniFaces 2.2, this issue was fixed and Ajax#updateRow() works for all rows in a table that have pagination. Testing the above code with OmniFaces 2.2 will reveal this:

API GH