0

I am having trouble trying to remove a row in the data table dynamically. Based on this article:

JSF 2.0 Dynamically Remove Components

Is there a way to refresh the data table automatically, after I select a row in 1 data table, and add that particular row's object into another data table; Meaning, if I select "A" and hit the "add" button, "A" appears in my 2nd data table, and my first data table that initially contains "A" refreshes , and it is removed from the table.

This is what I have so far:

Index.xhtml

<p:column> <h:commandLink value ="selection" action="#{usuariosGruposBean.selectionOfUserObject}">
<f:setPropertyActionListener target="#{usuariosGruposBean.user}" value="#{users}"/></h:commandLink>
</p:column>

UserGroup Bean

 public void selectionOfUserObject() {
        var1 = user.getId_usuario();
    }

public void testMethod() {
        listOfUsuarios = getListOfUsuarios();
        listOfUserGroups = getListOfUserGroups();
        selectionOfUserObject();

        if(listOfUsuarios.get(var1).equals(listOfUserGroups.get(var1))) {
            removeUsuarios();
        }
        else {
            System.out.println("Did not work");
        }
    }
}



public void finishAddUsuariosGrupos() {
        this.grps = grpDAO.getGrps(var2);
        this.user = userDAO.getUsuarios(var1);

        this.userGroups.setId_grupo(var2);
        this.userGroups.setId_usuario(var1);
        this.userGroups.setGroup(grps);
        this.userGroups.setUser(user);
        userGrpDAO.saveUsuariosGrupos(userGroups);
        testMethod();

    }

I modified my previous method to testMethod After running the application, I get this error now:

WARNING: #{usuariosGruposBean.finishAddUsuariosGrupos}: java.lang.IndexOutOfBoundsException: Index: 125, Size: 3
javax.faces.FacesException: #{usuariosGruposBean.finishAddUsuariosGrupos}: java.lang.IndexOutOfBoundsException: Index: 125, Size: 3
    at com.sun.faces.application.ActionListenerImpl.processAction(ActionListenerImpl.java:118)
    at javax.faces.component.UICommand.broadcast(UICommand.java:315)
    at javax.faces.component.UIViewRoot.broadcastEvents(UIViewRoot.java:794)
    at javax.faces.component.UIViewRoot.processApplication(UIViewRoot.java:1259)
    at com.sun.faces.lifecycle.InvokeApplicationPhase.execute(InvokeApplicationPhase.java:81)
    at com.sun.faces.lifecycle.Phase.doPhase(Phase.java:101)
    at com.sun.faces.lifecycle.LifecycleImpl.execute(LifecycleImpl.java:118)
    at javax.faces.webapp.FacesServlet.service(FacesServlet.java:409)
    at org.apache.catalina.core.ApplicationFilterChain.internalDoFilter(ApplicationFilterChain.java:290)
    at org.apache.catalina.core.ApplicationFilterChain.doFilter(ApplicationFilterChain.java:206)
    at org.apache.catalina.core.StandardWrapperValve.invoke(StandardWrapperValve.java:233)
    at org.apache.catalina.core.StandardContextValve.invoke(StandardContextValve.java:191)
    at org.apache.catalina.core.StandardHostValve.invoke(StandardHostValve.java:127)
    at org.apache.catalina.valves.ErrorReportValve.invoke(ErrorReportValve.java:102)
    at org.apache.catalina.core.StandardEngineValve.invoke(StandardEngineValve.java:109)
    at org.apache.catalina.connector.CoyoteAdapter.service(CoyoteAdapter.java:291)
    at org.apache.coyote.http11.Http11Processor.process(Http11Processor.java:859)
    at org.apache.coyote.http11.Http11Protocol$Http11ConnectionHandler.process(Http11Protocol.java:602)
    at org.apache.tomcat.util.net.JIoEndpoint$Worker.run(JIoEndpoint.java:489)
    at java.lang.Thread.run(Thread.java:636)

I have added a diagram to clarify what I am trying to achieve. I am not using an "update" button to manually update my data table. I am actually trying to do the following:

  • selecting a row using primefaces "single row selection" data table
  • click on add button
  • the data table updates itself.

enter image description here

Community
  • 1
  • 1
ShaunK
  • 1,181
  • 5
  • 22
  • 41

2 Answers2

0

I would suggest using AJAX tags to achieve this. Look into f:ajax tag usage.

You can also use a4J:support tags to dynamically "update" content in a particular container. a4J:commandLink and a4j:commandButton are another option to use and update content as well. Look into these tags as there are numerous examples on the Internet. By the way, the "a4J" tags are part of the RichFaces API.

Mechkov
  • 4,294
  • 1
  • 17
  • 25
  • I am currently using primefaces, hibernate, and JSF to build my application. Any idea if jsf/primefaces/hibernate as similar tags? – ShaunK Nov 04 '11 at 12:31
  • f:ajax is part of JSF2.0. You can make an event wired to the tag, like onchange or onclick or similar and have the ajax tag call a method in your beans that changes the content of your DateTable. After that you can use render attribute of the ajax tag to re-render your Date Table component. Hope this helps! Also look here for more info: http://mkblog.exadel.com/2010/04/learning-jsf-2-ajax-in-jsf-using-fajax-tag/ – Mechkov Nov 04 '11 at 12:36
  • Well I have the following method to compare the rows between the 2 data tables (I just posted it).However, the data table still doesn't refresh and delete the row. – ShaunK Nov 04 '11 at 12:44
  • Just call this method (assuming it is doing what it supposed to) from your ajax tag and then re-render the DateTable. – Mechkov Nov 04 '11 at 13:03
  • I did the following, but I got the following error...:/ do you have any idea what went wrong? – ShaunK Nov 07 '11 at 11:56
  • It seems like you got IndexOutOfBounds Exception. This is usually caused by assigning a variable or an object in an array and when the assigned variable exceeds the size of the array. You might want to check usuariosGruposBean.finishAddUsuariosGrupos method to fix. – Mechkov Nov 07 '11 at 12:27
0

All you need is using ajax.You would probably want to use a library that has a built-in support for ajax, like primefaces and richfaces.Then you would use update property of your button in order to immediate update your datatables.

sogukk
  • 37
  • 1
  • 2
  • 11
  • I am trying to update my tables dynamically without having to click on an "update" button. I am using primefaces single row selection data table in my application, and I am hoping that after selecting a row, and clicking on my "add" button. The datatable automatically updates itself. Is it possible? – ShaunK Nov 07 '11 at 10:42
  • `Is it possible?` It sure is, just pay attention to the dataTable section of the PrimeFaces manual. Not only it has various listeners, but also ajax-enabled event handlers. You could try something like this `onRowEditUpdate="@this"`. – jFrenetic Nov 07 '11 at 10:56