My JSF Books/Videos My JSF Tutorials OmniFaces/JSF PPTs
JSF 2.3 Tutorial
JSF Caching Tutorial
JSF Navigation Tutorial
JSF Scopes Tutorial
JSF Page Author Beginner's Guide
OmniFaces 2.3 Tutorial Examples
OmniFaces 2.2 Tutorial Examples
JSF Events Tutorial
OmniFaces Callbacks Usages
JSF State Tutorial
JSF and Design Patterns
JSF 2.3 New Features (2.3-m04)
Introduction to OmniFaces
25+ Reasons to use OmniFaces in JSF
OmniFaces Validators
OmniFaces Converters
JSF Design Patterns
Mastering OmniFaces
Reusable and less-verbose JSF code

My JSF Resources ...

Java EE Guardian
Member of JCG Program
Member MVB DZone
Blog curated on ZEEF
OmniFaces is an utility library for JSF, including PrimeFaces, RichFaces, ICEfaces ...

.

.

.

.

.

.

.

.


[OmniFaces Utilities] - Find the right JSF OmniFaces 2 utilities methods/functions

Search on blog

Petition by Java EE Guardians

Twitter

marți, 14 iulie 2015

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

Niciun comentariu :

Trimiteți un comentariu

JSF BOOKS COLLECTION

Postări populare

OmniFaces/JSF Fans

Visitors Starting 4 September 2015

Locations of Site Visitors