9 Replies Latest reply: Nov 21, 2012 2:27 PM by kdario RSS

    How use af:clientAttribute tag on ADF table

    FonzDesselle
      I am trying to pass additional to parameters to my javascript function when a user double clicks on a table row. I found some code that said you can do something like this

      <af:table>
      :
      <af:column sortProperty="DepartmentId" sortable="false"
      headerText="#{bindings.DepartmentsView1.hints
      .DepartmentId.label}">
      <af:outputText value="#{row.DepartmentId}">
      <af:convertNumber groupingUsed="false"
      pattern="#{bindings.DepartmentsView1.
      hints.DepartmentId.format}"/>
      . <af:clientAttribute name="rowKey"
      value="#{row.rowKeyStr}"/>
      . <af:clientListener method="handleDepartmentClick"
      type="dblclick"/>
      </af:outputText>
      </af:column>
      </af:table>

      This approach is okay, but I would have to add af:clientListener and af:clientAttribute to each column of the table to handle the double click of a row. Anyone know of a way I can just set the listener and attributes on the entire row? Instead of just the column?
        • 1. Re: How use af:clientAttribute tag on ADF table
          kdario
          You can set af:clientListener under af:table(instead of af:column)

          Dario
          • 2. Re: How use af:clientAttribute tag on ADF table
            FonzDesselle
            Hi Dario,

            Thanks so much for your response. The only thing with your solution is that it does not allow me to pass extra parameters to my javascript. Do you know how I can do that without adding clientAttribute under each column? I tried adding under the table, but jdeveloper does not let you do this.
            • 3. Re: How use af:clientAttribute tag on ADF table
              codigoadf
              Hi,
              maybe is better use a custom selectionListner in the table
              • 4. Re: How use af:clientAttribute tag on ADF table
                kdario
                >
                I tried adding under the table, but jdeveloper does not let you do this
                >
                Well, you can probably ignore this error.
                But, if you tell us what is your use case, maybe someone can suggest better approach.

                Dario
                • 5. Re: How use af:clientAttribute tag on ADF table
                  Timo Hahn
                  Check out Jobineshs blog http://jobinesh.blogspot.de/2011/03/displaying-edit-dialog-on-double-click.html?m=1 which shows how you can do this.

                  Or this article from Frank http://www.oracle.com/technetwork/developer-tools/adf/learnmore/56-handle-doubleclick-in-table-170924.pdf

                  Timo
                  • 6. Re: How use af:clientAttribute tag on ADF table
                    FonzDesselle
                    Hi Timo,

                    Thanks for these links. The only thing here is that I still don't see how i can pass an attribute to the javascript without attaching a clientAttribute tag to each column.

                    So here is the javascript I have

                    <af:resource type="javascript">
                    function handleTableDoubleClick(evt){  
                    var table = evt.getSource();
                    AdfCustomEvent.queue(table, "TableDoubleClickEvent",{}, true);
                    evt.cancel();
                    }
                    </af:resource>

                    I want to be able to set this function up so that I can pass it the server handler string. Something like this..

                    function handleTableDoubleClick(evt){  
                    var table = evt.getSource();
                    *var serverHandlerString = +<somehow get this string as an attribute or someother way>+*
                    AdfCustomEvent.queue(table, serverHandlerString ,{}, true);
                    evt.cancel();
                    }

                    If I can do this without using attributes that works too.. My first thought was just to pass the serverHandler string as an attribute.

                    Edited by: Fonz Desselle on Nov 12, 2012 1:23 PM
                    • 7. Re: How use af:clientAttribute tag on ADF table
                      Timo Hahn
                      You mean you want to pass a parameter to the event handler on the server?


                      On the page I use
                      <af:resource type="javascript">
                                    function customClientCode(event)
                                    {
                                        var inputComp = event.getSource();
                                        AdfCustomEvent.queue(inputComp,
                                             "myCustomEvent",
                                             // Send one parameter as Boolean
                                             {skyIsFalling:true},
                                             // Make it "immediate" on the server
                                             false);       
                                      event.cancel();
                                    }
                      </af:resource>
                      ...
                                              <af:commandButton text="Check Before loading" id="cb1" partialSubmit="false"
                                                                disabled="false"
                                                                clientComponent="true">
                                                  <af:clientListener method="customClientCode" type="action"/>
                                                  <af:serverListener type="myCustomEvent" method="#{FDLTestBean.doCustomEvent}"/>
                      and the server listener in the bean:
                          public void doCustomEvent(ClientEvent event)
                          {
                            if (Boolean.TRUE.equals(event.getParameters().get("skyIsFalling")))
                            {
                                _logger.info("OnServer...");
                                //Work here
                            }
                          }
                      Timo
                      • 8. Re: How use af:clientAttribute tag on ADF table
                        FonzDesselle
                        Hi Timo,

                        Thanks for your response ..

                        I want to pass a parameter from the server to my javascript. But I wanna pass it when the user double clicks a row on the table. As of now, the only way I've been able to do this is by adding a clientListener to each column in the table like this..

                        <table>
                        <af:serverListener type="myCustomEvent" method="#{FDLTestBean.doCustomEvent}"/>
                        <column id = 1>
                        <outputText>
                        <af:clientListener method="customClientCode" type="action"/>
                        <af:clientAttribute attiribute name="serverMethodName" value="handleEvent1" />
                        <outputText/>
                        <column/>
                        <column id =2>
                        <outputText>
                        <af:clientListener method="customClientCode" type="action"/>
                        <af:clientAttribute attiribute name="serverMethodName" value="handleEvent1" />
                        <outputText/>
                        <column/>
                        <column id=3>
                        <outputText>
                        <af:clientListener method="customClientCode" type="action"/>
                        <af:clientAttribute attiribute name="serverMethodName" value="handleEvent1" />
                        <outputText/>
                        <column/>
                        <table>


                        As a result, in my javascript code I can just grab the method name I need to call from the parameter passed from the server .. like this

                        function customClientCode(event)
                        {
                        var inputComp = event.getSource();
                        var serverMethodName = evt.getSource.getProperty("serverMethodName");
                        AdfCustomEvent.queue(inputComp,
                        serverMethodName,
                        // Send one parameter as Boolean
                        {skyIsFalling:true},
                        // Make it "immediate" on the server
                        false);
                        event.cancel();
                        }

                        The thing is, the above will work but I have to add the clientListener and clientAttribute tag under each outputText of each column in the table. I would have to do this for every table in my app. I'm trying to figure out a less tedious way of passing the parameter without having to add under each column.

                        OR

                        Is there another way I can re use my javascript method over and over again for all tables that executes an action when a row is double clicked. As of now, if I do it the way you posted. I would have to rewrite a javascript method for each different table that has a double cliick. Is that correct?

                        Edited by: Fonz Desselle on Nov 21, 2012 12:06 PM
                        • 9. Re: How use af:clientAttribute tag on ADF table
                          kdario
                          You can add clientListener and clientAttribute to af:table element(instead of af:column) and ignore error which jdev will show for af:clientAttribute.
                          Or you can delete af:clientAttribute and in your javascript use something like:
                          var table = event.getSource();  // when you put af:clientListener to af:table instead af:column
                          var tableId = table.getId();
                          
                          if(tableId == ...) ...
                          Dario