Pagination with rich:subTable & rich:dataTable

Ok.. I could now get the sorting working with dataTable and subTable in my seam application. I have one last problem to tackle , how can I do pagination with data displayed from multiple subTables ? The rich:datascroller does a decent job of providing an automatic pagination if we provide it with a dataModel, but I am struck with a dilemma.. before going into details further, lets look at the following images.



when clicked on the button in the first column the row expands revealing the detail rows which are implemented using subTable



The dilemma I am talking about is , which table-id should i give to datascroller for handling pagination? of course the first (main) table's table id, as we want to display the main table's rows and let the user click on the rows to reveal the detail rows. But imagine if we have another level of grouping which effectively calls us to use three sub tables, and we want to paginate on the second grouping level, how shall we handle this ?

I quickly realized that it is not possible for a single datascroller to handle this because the total number of rows to be displayed on a page are going to come from multiple parent rows , hence multiple subTable id's and multiple datascroller components !!! I know its not a clean way...

The cleaner way is to somehow leverage the dataTable components properties which allows us to control the number of rows to display (these are the same attributes that are used by datascroller component to achieve pagination)

Similar to external pagination which we used to implement pagination with dataTable and subTable , I have to come up with a helper which determines how many rows each dataTable and subTable component shall display to simulate a pagination usecase.

incase if you have not familiar with how datascroller component achieves pagination try this on your dataTable

     
                  
                         #{detail.name}
                 
                 
                         #{detail.place}
                 
    

The attribute "first" indicates the first row to display and the "rows" attribute the number of rows. As you might have guessed the above snippet displays the page "2" .

I will have to use the above scheme to simulate pagination across multiple subTables

Changing Effects without resorting to javascript in RichFaces JSF

Recently I had to use <rich:effect> to make a richPanel appear with BlindDown effect on user action. It was easy for me as I just had to use code as below to accomplish this

 
  .....
  
  
  
     
     
  

Just as it was given in RichFaces Demo site. Now I had to do this tricky part, I have to show the panel when user clicks the link "click" for the first time and BlindUp to close the panel when clicked again. I know we can easily do it with javascript as it just uses the scriptaculous library, I wanted to avoid javascript (rather explicitly in JSF applications), so came up with this solution.

As I will be toggling the effect for panel based on the values that I am going to display from my seam action, i wanted to use the data to differentiate if I need to show or hide the panel

 
  .....
  
  
  
     
     
  

Note that the oncomplete handler is unchanged (where I thought I will have to call a different javascript here initially ..), we will be changing the effect type based on our business specific condition which can help us determine whether to close the panel or to open it.

Also notice, that the style element for the richPanel is set to display:none or display:block , this is to hide the panel initially so that BlindDown effect make sense.. and similarly used display:block to make sure user can see the effect of panel hiding using the BlindUp effect

..
 
..

Readonly Value Binding in JSF for a hidden field

Many of the newbies of JSF will encounter situations where they find everything they wrote perfect but the JSF implementation throws strange errors. Here is one of the classic ones that you may step on.. .

Imagine you want to store some number(like some count) in a hidden field so that you can use it in your javascript to perform some task.

     .....
     
     
     

you strongly know this should work fine, particularly when you are coming from a JSP/struts/struts2 background, but when this page gets submitted you will see errors from JSF saying that the count is not writable for int . This is because there is no setCount method on the someList bean, Although we are not writing anything to the hiddenField, we have to understand when ever a form gets submitted JSF tries to apply back the values into the component tree.

How to solve this ? Here is how they do it.

just add readonly="true" attribute to h:inputHidden, this will ensure JSF will not try to apply values through setCount method, but still renders the value to the page

     .....
     
       
     
 

Hope this helps..

By the way ..this is my first post from my new MacBook Pro :-)