September 14th, 2009 by Lincoln Baxter III

JSF’s <h:dataTable> vs <ui:repeat> – How to get the selected row.

So, a little while ago I was attempting to use JSF’s Facelets <ui:repeat> tag, as a replacement for <h:dataTable>, but difficulty came when I needed to process actions on individual records of each row. <ui:repeat> allows iteration over a List of Array[] of items, but it does not provide a method of discovering the “selected” or “actioned” row; there’s no way to discover the row the user is interacting with. Or is there? I’ve since learned of two ways to deal with this situation:

1. Use ListDataModel

I asked another JSF Expert, Dan Allen (author of Seam in Action) and here’s what he told me: From Dan’s email, I learned that you could place a List of objects in a ListDataModel wrapper, effectively binding the state of the list to the UI. With that done, you can manipulate the data in an action-method, being able to retrieve the selected row index, object itself, and continue as you would expect with your programming.

2. Upgrade to an advanced EL (EL2) Jar

Probably my favorite solution – you can use EL2 method invocation, provided either by Seam, or Sun’s reference implementation, and pass the desired objects directly to methods in your JSP/Facelet code. It’s coming standard in J2EE 6, but why wait? This method is simple, intuitive, and enables much more powerful and reusable Beans to handle page code, reducing redundancy in Model classes and business logic. Note how I pass the current var object directly to the method via EL:
<h:commandButton id="add" value="Add Task" 
    action="#{itemController.addItemNote(currentItemBean.item, addNoteBean.newNote)}">
And here’s the Backing Bean code:
@ManagedBean
@RequestScoped
public class ItemController
{
    public String addTask(final Item item, final Note note)
    {
        ItemService.addNote(item, note);
        return "pretty:viewItem";
        // this return statement is a PrettyFaces JSF bookmarking navigation id
    }

For instructions on how to: include EL2 in a JSF project go here.

For more information on JSF SEO and Bookmarking, take a look at PrettyFaces: URL rewriting extension for JSF.

If you are at all confused by these examples, feel free to leave a comment, and I’ll do my best to help.

Lincoln Baxter, III

About the author:

Lincoln Baxter, III is the Chief Editor of Red Hat Developers, and has worked extensively on JBoss open-source projects; most notably as creator & project lead of JBoss Forge, author of Errai UI, and Project Lead of JBoss Windup. This content represents his personal opinions, not those of his employer.

He is a founder of OCPsoft, the author of PrettyFaces and Rewrite, the leading URL-rewriting extensions for Servlet, Java EE, and Java web frameworks; he is also the author of PrettyTime, social-style date and timestamp formatting for Java. When he is not swimming, running, or playing competitive Magic: The Gathering, Lincoln is focused on promoting open-source software and making technology more accessible for everyone.

Posted in JSF

14 Comments

  1. Geert says:

    I’ve been craving to be able to just pass a parameter into action methods!
    Since I can’t use Seam I’ve been using
    It leads to a setProp(someval) prior to invocation of the action method.

    Anyway I know passing parameters is possible in Seam, but can’t find any references to it in J2EE6, or to “advanced EL2” outside of Seam. Can you provide any URLs for more info on the standard (non-seam) implementations of this?
    thanks!

  2. Geert says:

    oops some markup was removed from previous post. That should have been:

    <f:setPropertyActionListener target="#{bean.prop}" value="someval" />

  3. Lincoln says:

    I’ve added the Maven repository and artifactId for each implementation, hope this helps.

  4. Pls help on getting dynamic ids says:

    I am trying to implement suggestion box in ui repeat. First suggestionBox works fine as expected:
    a) somehow when I use the same in ui repeat suggestionAction event is not fired..
    b) Sugeestion box uses id to display its content, problem is when user clicks “Add More regs” new row is added and id needs to be changed, please suggest how can handle dynamic ids to render suggestion box value as in code below.

    <rich:suggestionbox id="suggestionBoxId" for="text" tokens=",[]"

    We are using jboss4.2.3 and richfaces 3.3.1, jdk5

    Please give your valuable inputs it will be very helpful.

    XHTML

    //THIS WORKS FINE

    //NOT WORKING, SUGGESTIONACTION EVENT IS NOT FIRED

    ….

    Save…

  5. Scott Langley says:

    Do you know if the syntax for the advanced features in JBoss EL and the new Sun EL 2.1.2 in J2EE 6 / Glassfish 3 are completely compatible? That is, is either jar a drop-in replacement for the other?

    Thanks.

    1. Lincoln says:

      They are mostly the same, if I am not mistaken! Though Seam EL may provide some additional functions off of the List type.

      1. ved says:

        Hi Lincoln,
        I have problem in datatable of jsf. i want to create dynamic data. my complete data in a double array you can suppose.
        like

        private Set bundleColumns;

        :-complete column so i can figure out how many rows will need to populated.

        Map<rowId here,Map> bundleMap;

        so how i can draw on server side please let me know. i also try few examples but did not get any solution. its urgent please reply me. my id is ved.java@gmail.com

  6. Lincoln says:

    Ved,

    I’m not sure what you are asking.

    Could you please give an example of what you’re trying to do?

  7. krishna says:

    Hi Lincoln, can we have something like highlite aparticular row in a datatable?

  8. candace says:

    Hi Lincoln,

    Any comments/updates on how to selecting a row in a JSF dataTable? I need to provide the same functionality in a JSF table that I could provide with an onclick JavaScript event in HTML. I need to change the CSS when a table row is clicked.

  9. Mike says:

    Hi Lincoln,

    I added EL2 to my project by downloading el-api and al-impl from the sources you mentioned in the respective link and copied them to WEB-INF/lib (I don’t use maven). Additionally, I added the given parameter entry to web.xml. In my xhtml file I added a button with

    where row is an ArrayList. However, eclipse keeps telling me the “Syntax Error in EL”. What am I doing wrong? I was as well adding the two jar-files to the classpath libraries but same effect. I am using eclipse indigo with the JSF reference impl (mojarra) and glassfish 3.1.

    Regards,

    Mike

    another try – this time without the pre-wrapper

  10. Franek says:

    Hi,
    I’m using very easy solution:

    Function portfolioTypeView.selectItem() set selectedItem atribute in class PortfolioTypeView.
    It’s realy work.

    1. Franek says:

      Here is code:

      <ui:repeat value="#{portfolioTypeView.listPortfolioType}" var="portfolioTypeItem">
                          <h:outputText value="#{portfolioTypeItem.typeName}"/>
                          <h:commandLink value="Create" action="#{portfolioTypeView.selectItem(portfolioTypeItem)}"/> <br/>
      </ui:repeat>
  11. Amit says:

    I m working with seam framework,
    I have a Table for eg. student (no, name)
    & for that I created Seam Generated entity using wizard in eclipse.
    which gives me an entity & a session file to manage data of student.

    In my page I have taken a JSF dataTable, in that data table I m able to display the two columns no & name

    But in addition I want to add check box for row selection and a button.
    when I that button I want selected data !!

    If you help me, I will b very thankful to you !!

Leave a Comment




Please note: In order to submit code or special characters, wrap it in

[code lang="xml"][/code]
(for your language) - or your tags will be eaten.

Please note: Comment moderation is enabled and may delay your comment from appearing. There is no need to resubmit your comment.