+ Start a Discussion
Big EarsBig Ears 

<analytics:reportChart> - Need help modifying the "onClick" behaviour

Dear all,

When you click on an "Analytics:reportChart" component on a VF, it will take you to the filtered report, which is great. However, this is actually a problem if the VG page is inline on a record. I'd like to be able to modify the onclick behaviour, so that it takes the parent window to the filtered report. I'm coming across these issues:
  1. Adding an "actionsupport" component seems to make no difference to the behaviour, or break the report
  2. Trying to surround the component with an outputPanel and adding an onClick attribute to that component breaks the report
  3. I'm unsure how to pass in the variables, so the report that gets run will have the right filters applied
The error I'm getting is: "Error while running $A.run() : Cannot read property 'descriptor' of undefined"

Is what I'm trying to do even possible?

Big EarsBig Ears
When I say "report" in points 1 & 2 above, I mean the <analytics:reportChart> component. Sorry to be unclear.
Pavan Kumar KajaPavan Kumar Kaja
Hi,

Try Below one. Let me know if it work for u or not.


<apex:page>
<script type="text/javascript">
    function Test(){
        var url = 'https://ap1.salesforce.com/00O900000070URt';
        window.parent.location.replace(url);
    }
</script>
<apex:outputLink onclick="Test();">
    <analytics:reportChart reportId="00O900000070URt"></analytics:reportChart>
</apex:outputLink>
</apex:page>


Big EarsBig Ears
Ashi,

Thank you - This seems to be working. Part of my problem was that I was trying to push id variables into the function which you've called "Test". This was failing until I realised that i needed to encase them in quotes.

I'm guessing that there's no way to have the report filter, though, using the reporting API, or similar?

As a workaround, I could use the url hack to pass in filter variables, but will need to create a 2nd report exactly like the first report, but with a filter variable for the record Id that's hosting the inline VF page.

Andy
Pavan Kumar KajaPavan Kumar Kaja
Hi Big Ears,

Will agree with ur only one workaround of passthe variable to the report using url hack.

Can you please let me know what your tring to implement exactly. so that we can think about any other possibility. Still iam not clear that what you r trying to do.
Big EarsBig Ears
Ashi, 

Thank you for your response, sorry if I've not been clear enough.

Salesforce has the ability to add report graphs to page layouts. The graphs show reports filtered by the id of the records. Clicking on those graphs will take you to the filtered reports. This is great functionality, but only allows a small number of graphs.

We wanted to create a more flexible inline Visualforce Page that would perform similarly to the built in functionality, but also be able to show more graphs. We wanted to put a number of graphs together in a tab panel:

User-added image

This is the inline VF page, in the page layout for a Custom Object we've created. We wanted to be able to click onto any of these graphs and be directed to the filtered report. So, I've slightly amended your code to accept the id of the report:

<script type="text/javascript">
     function Test(url){
         var url = '/'+url;
         window.parent.location.replace(url);
     }
</script>

<apex:outputLink onclick="Test('ExampleReportId');">	
      <analytics:reportChart reportId="ExampleReportId"/>
</apex:outputLink>

This didn't quite work, as the report wasn't filtered to the record Id of the Custom Object, so I cloned the report and then added in a new filter that I could pass variables into:

<script type="text/javascript">
      function Test(url){
           var url = '/'+url+'?pv2={!CustomObject__c.id}';
	   window.parent.location.replace(url);
	}
</script>

<apex:outputLink onclick="Test('ClonedReportId');">	
	<analytics:reportChart reportId="ExamplereportId" />
</apex:outputLink>
When this works, it's pretty great. The issue is that the Visualforce Page often loads an error message and the report chart has failed:

User-added image

The error I'm getting is: "Error while running $A.run() : Cannot read property 'descriptor' of undefined"

Do you know what that might be referring to?
Andrew Hoban 6Andrew Hoban 6
You cannot use <analytic:reportchart> in <apex:tabpanel>: https://help.salesforce.com/apex/HTViewSolution?id=000212701&language=en_US

You need to refernece it as an iFrame.
Sohit BhardwajSohit Bhardwaj
As of now its issue on salesforce side.

To workaround this issue you create a new Visualforce new page containing the <analytics:reportChart> tag and embed the page inside an <apex:tab> tag using an iframe as follows: 

Visualforce Page with embedded iframe: 

<apex:page id="Page" showHeader="false" sidebar="false" > 
<apex:tabPanel> 
<apex:tab label="Tab1" name="Tab1"> 
<apex:iframe src="/apex/iframepage"/> 
</apex:tab> 
</apex:tabPanel> 
</apex:page> 

Visualforce Page containing <analytics:reportChart> tag to be embedded: 

<apex:page id="Page" showHeader="false" sidebar="false" > 
<analytics:reportChart reportId="00O900000070URt" /> 
</apex:page>