APIs for the Internet of Things

Max Katz

Subscribe to Max Katz: eMailAlertsEmail Alerts
Get Max Katz via: homepageHomepage mobileMobile rssRSS facebookFacebook twitterTwitter linkedinLinkedIn

Blog Feed Post

Learn how to add/delete table row with RichFaces [in 5 minutes]

I have seen this question more than once now, how do you add/delete a row in a table? Turns out it’s pretty simple. Although you can’t do partial table update which RichFaces supports, when adding or deleting a row, jut render the entire table. This will also work with a standard JSF table. Also, a related post is How to delete a row in JSF. RichFaces 3.3.3 is used.

The page looks like this:

JSF page:

      <h:panelGrid columns="2">
         <a4j:commandButton value="+" action="#{bean.add}" reRender="list" />
	 <a4j:commandButton value="-" action="#{bean.remove}" reRender="list" />
      <rich:dataTable id="list" value="#{bean.list}" var="item" width="60px">
	    <h:outputText value="#{item}" />

Managed bean:

public class Bean {
   private List<Integer> list;
   public void init() {
      list = new ArrayList<Integer>();
   public void remove() {
      // remove last
      if (!list.isEmpty()) {
         list.remove(list.size() - 1);
   public List<Integer> getList() {
      return list;
   public void add() {

The only thing to mention is that @KeepAlive gives us view scope. This way we can keep the same bean between requests. More on view scope in RichFaces.

JSF configuration file:


That’s it.

Read the original blog entry...

More Stories By Max Katz

Max Katz heads Developer Relations for Appery.io, a cloud-based mobile app platform. He loves trying out new and cool REST APIs in mobile apps. Max is the author of two books “Practical RichFaces” (Apress 2008, 2011), DZone MVB (Most Valuable Blogger), and is a frequent speaker at developer conferences. You can find out what Max is up to on his blog: http://maxkatz.org and Twitter: @maxkatz.