4 Replies Latest reply on Apr 27, 2016 1:35 AM by Ben Han

    onclick event on datatable row with richfaces 4

    Hauke Gulich Newbie

      Hello everyone,

       

      I just migrated my richfaces 3 application to richfaces 4 including to migrate to jboss 7. I modified a lot and most of the things are working now. But I still have problems when I click on one row (one column) inside a rich:datatable.

       

      What I did with richfaces 3 was to put an a4j:ajax (I think the tag was called different but I changed that to aj4:ajax already) inside the rich:column tag with an onclick event and an listener. But that isn't working anymore.

       

      Here is my code:

       

       

      {code:xml}

      <rich:dataTable value="#{placeholder_control.lichtList}" var="licht" width="100%" id="lichtListe" columns="2">

      <rich:column>

                  <f:facet name="header">

                      <h:outputText value="Beschreibung" />

                  </f:facet>         

                  <h:outputText value="#{licht['beschreibung'].stringValue}" width="20" />

                  <a4j:ajax immediate="true" event="onclick" render="testingID" listener="#{placeholder_control.selectActiveLight}">

                      <f:attribute name="rowKey" value="#{licht['id'].stringValue}" />

                  </a4j:ajax>            

              </rich:column>

      ...

      ...

      <h:outputText value="This is the id : #{placeholder_control.selectedLight}" id="testingID"></h:outputText>

      {code}

       

      And my bean looks like this:

       

       

      {code}

      @ManagedBean (name="placeholder_control")

      @SessionScoped

      public class ControlPlaceholder {

       

      public void selectActiveLight(ActionEvent evt) {

         String selectedRow = (String) evt.getComponent().getAttributes().get("rowKey");

         System.out.println("Selected Light : " + selectedRow);

         setSelectedLight(selectedRow);

      }

      {code}

       

      I want to pass an attribute to the listener methode to identify which row was clicked in order the manipulate something inside the bean (setSelectedLight) and then the "testingID" - ID should be rerendered.

       

      It seems that the listener isn't called at all at the moment.

       

      I also put the h:form inside the xhtml page (I forgot that earlier).

       

      Many greetings and thanks,

      Hauke

        • 1. Re: onclick event on datatable row with richfaces 4
          Mark Paluch Master

          Hi Hauke,

          try following statement in your code to get it running:

           

              public void selectActiveLight() {

                  UIDataTable component = (UIDataTable) FacesContext.getCurrentInstance().getViewRoot()

                          .findComponent("form:lichtListe");

                  String selectedRow = component.getRowData().toString();

                  System.out.println("Selected Light : " + selectedRow);

                  model.setSelectedLight(selectedRow);

              }

           

           

            <h:form id="form">

            <a4j:outputPanel id="in">

            <rich:dataTable value="#{model.messages}" var="licht" width="100%"

            id="lichtListe" columns="2">

            <rich:column>

                                                                      <f:facet name="header">

            <h:outputText value="Beschreibung" />

            </f:facet>

           

            <a4j:commandLink value="#{licht}" render="testingID"

            action="#{controller.selectActiveLight}">

           

            </a4j:commandLink>

            </rich:column>

            </rich:dataTable>

            <h:outputText value="This is the id : #{model.selectedLight}"

            id="testingID"></h:outputText>

            </a4j:outputPanel>

            </h:form>

           

          I changed the model for my testing purposes.

           

          Best regards,

          Mark

          • 2. Re: onclick event on datatable row with richfaces 4
            Hauke Gulich Newbie

            Hi Mark,

             

            I will try that later today as soon as I am home from work, but looking at your code it seems that you put a link inside the dataTable. <a4j:commandLink> but I want something like this:

             

            first table on top of the page has a list with customers (name, firstname, street and city). Now if I click on any of those columns (name, firstname ...) a second table (at the bottom) should display the details of the selected customer.

             

            So the function with 'onclick' should be available to the whole cell and not only for the text within the cell and it shouldn't be make any difference in which cell you click on each row.

             

            I did that with richface 3 like I posted before with

             

            <a4j:support> within the rich:column tag and that for each column inside the dataTable.

             

            the a4j:support tag had the onclick event with the listener and a f:attribute for the value I could read inside the listener method. That worked really good.

             

            But I will try your example. Maybe I missed something in your code.

             

            Greetings,

            Hauke

            • 3. Re: onclick event on datatable row with richfaces 4
              Roberto Cordoba Newbie

              Hi Hauke,

               

                did you manage to solve your problem? I have the same problem.

               

              Actually, if I do next, it doesn´t work:

              <rich:column styleClass="columna" id="paisColumna" label="#{msj.pais}"  >

                                                                                    <a4j:ajax event="change" listener="#{I18nBean.setPais}" status="esperaStatus" render="panelBuscarCharter" />

              </rich:column>

               

              Bean:

              public void setPais(AjaxBehaviorEvent event) {

                                  locale = new Locale("en");

                                  FacesContext.getCurrentInstance().getViewRoot().setLocale(locale);

              }

               

               

              but if I do this (put the ajax call inside selectBooleanCheckBox in example, it works (with the same bean)  :

               

              <rich:column styleClass="columna" id="paisColumna" label="#{msj.pais}"  >

                                                                                    <h:selectBooleanCheckbox id="mismoPuerto3" value="#{InicioBean.mismoPuerto}" class="perrisCheckbox">

                                                                                              <a4j:ajax event="change" listener="#{I18nBean.setPais}" status="esperaStatus" render="panelBuscarCharter" />

                                                                                    </h:selectBooleanCheckbox>

                                                                  </rich:column>

               

               

              I hope you can help me.

              Thanks,

              Roberto.

              • 4. Re: onclick event on datatable row with richfaces 4
                Ben Han Newbie

                In RichFaces 4.x, <a4j:ajax> can't work under <rich:column> element directly, because the component of <rich:column> doesnt' implement javax.faces.component.behavior.ClientBehaviorHolder interface.

                Move <a4j:ajax> to under the <rich:dataTable> element directly will be fine.