Friday 22 November 2013

DataTable Row Selection: Update other parts of the page when a DataTable Row is selected - PrimeFaces 4.0

Before you start on anything, make sure you are using PrimeFaces 4.0. or higher, otherwise RowSelecction is a mystery, you can see here.

If you are reading this post, you are probably having a dataTable that does Row selection either using checkbox, Radio button or non of these but selectable, but if you just want to know how to achieve Row selection, then click here. You wish to display something on the same page based on the selected row, you have tried but it seems not to work. It seems to work for a dialog but not for other sections of the page that are not in the dialog. I suffered for about three days trying out different things, but on the 4th day I got it right. So here it is....

When you have a dataTable with row selection, there are 3 scenarios;
  1. You have checkboxes : multiple Selection
  2. You have Radio Buttons: Single Selection
  3. You neither have Checkboxes nor Radio buttons, but your Rows are selectable. 
 Make sure you are using scenario 3.

If you are using scenario 1 or 2 (If you must have checkboxes, or Radio buttons), refer to this page.

If you want to update another section of the page, there are two scenarios;
  1. The section you wish to update is in the same form with the dataTable and on the same page
  2. The section you wish to update is in another form and on the same page. If you are using this option, you just need to know how to call the id of the component e.g :form:Container:idOfComponent
Any of 1 or 2 is ok. 

<p:dataTable>
      <p:event="rowSelect" update="Id of component you wish to update" listener="a method that you wish to execute when you select a row"
</p:dataTable


If you want a more descriptive example, look at this

The reason why I had to suffer for 3 days was, I didn't know that I had to use scenario 3 for things to work. This was all I had to find out.