7 Replies Latest reply: May 2, 2014 9:35 AM by Shas RSS

    Action Link from Pie-Chart to refresh a report region within the same page

    Shas

      APEX Gurus

       

      Have requirement that we have the chart region and report region within the same page and based on the action link from pie-chart need to be able to refresh the report region within the same page

       

      e.g: I have the expense report spend by category as a pie-chart and on the action link of that I want to refresh a report region by the right side of it (Within the same page) to show the details under that category spend - Also I don't to refresh the same page all over again, just to refresh the report region with the category click on the pie-chart

       

      Any help would be great on this - I am using APEX 4.2

       

       

      Thanks

      Shas

        • 1. Re: Action Link from Pie-Chart to refresh a report region within the same page
          scott.wesley

          There are a few techniques for this, something I've done recently (adopted off the top of my head, needs testing):

          function clickPie(t) {
            $s('P1_ID',$(t).attr('data-id'));
            $('#pie_report').trigger('apexrefresh');
          }
          

          Your link attribute for the pie target needs to include

          data-id="#ID#"

          with a target/URL destination of

          javascript:clickPie(this);

           

          You need to apply static ID to your region to be refreshed

          pie_report

          And include page item to submit for use in the report SQL

          P1_ID

          And obviously a hidden item P1_ID to hold your value.

           

          Scott.

          • 2. Re: Action Link from Pie-Chart to refresh a report region within the same page
            Shas

            Hi Scott,

             

            Thanks for your response - Sorry I am relatively new to APEX

             

            Could you please advise me where we need to create this function "clickPie"

             

            I understand that P1_ID is a item attribute (Hidden) in the target region and when adding this in the action link of the pie-chart - it takes the clicked pie "label" and passes it to the variable P1_ID in the target region and then does a refresh of that report region?

            • 3. Re: Action Link from Pie-Chart to refresh a report region within the same page
              scott.wesley

              When testing it out it's easiest to place javascript in Page Attributes -> Function and Global Variation Declaration

              Over time you would collate javascript functions into a dedicated .js file, then include it in your page templates.

               

              Big picture is close:

              Clicking the pie would run the javascript to record into P1_ID whatever is in the ID column value of your table, change to #MY_DESC# if necessary for your query

              Then it forces refresh of your region to show the data specific to the chosen ID.

              The "page item to submit" attribute ensures APEX copies the value from the browser to the database for use in the query

              • 4. Re: Action Link from Pie-Chart to refresh a report region within the same page
                Shas

                Hi Scott,

                 

                I now have in my page -> java script section the following code,

                 

                function clickPie(t) { 

                  $s('P4_ITEM_CATEGORY',$(t).attr('data-id')); 

                  $('#CategoryDetailsDD').trigger('apexrefresh'); 

                }

                 

                Here P4_ITEM_CATEGORY is a item on my report region I want to refresh (Hoping that clicking the pie would set the value of this variable in the report region with the value

                CategoryDetailsDD is my report region's static ID

                 

                And in the pie-chart action link I have set to URL and have the following in the URL : javascript:clickPie(this)

                 

                I am certainly missing something and hence my click on the pie does not do anything right now

                 

                Thanks for your help

                • 5. Re: Action Link from Pie-Chart to refresh a report region within the same page
                  Tom Petrus

                  It doesn't work because you have not specified the "data-" attribute. However, you can not define it in the "Action Link" of the chart series. You can only specify the url, but no attributes.

                  This makes sense however, since there are no anchor attributes being generated. Calling a javascript function from the action link with a value of "this" will not return the current datapoint or some link, but it will return "window". Not very usable then

                  I would change the setup to not pass "this", but pass on the actual ID in the function call.

                  target/URL destination of

                  javascript:clickPie("#ID#");

                   

                  With the function clickPie:

                  function clickPie(pId) { 
                    $s('P4_ITEM_CATEGORY', pId); 
                    $('#CategoryDetailsDD').trigger('apexrefresh'); 
                  }
                  

                  And you should put the javascript function under edit page > javascript > function and global variable declaration.

                  • 6. Re: Action Link from Pie-Chart to refresh a report region within the same page
                    Shas

                    Thanks Tom - unfortunately everything else works but I am not able to pass my label value from the clicked "Pie" to the java script

                     

                    I have tested by passing a constant string and with that it works fine to set my item attribute on the report region to refresh but not able to pass the clicked pie label to the java script

                    • 7. Re: Action Link from Pie-Chart to refresh a report region within the same page
                      Shas

                      Thanks Tom / Scott - Its now worked

                       

                      Following in my javascript function code in the page section,

                       

                      function clickPie(pID){

                          $x('P4_ITEM_CATEGORY').value = pID;

                          $('#CategoryDetailsDD').trigger('apexrefresh');

                        }

                       

                      And following is my URL section of the pie-chart action link

                      javascript:clickPie("#LABEL#")