Forum Discussion
julianmbs
10 years agoAdvocate II
Power BI Embedded report does not respond well
Hi, I have embedded a simple Power BI report (using Import Data option) in my ASP.NET application, and it displays fine. But when I try to click on something, there is a problem. If I try to chan...
jocaplan-MSFT
10 years agoMicrosoft Employee
It feels like something could be in the way. Any chance that some part of your applications UI is covering part of the iframe?
julianmbs
10 years agoAdvocate II
No, there shouldn't be anything in the way. It's a simple page that shows company logo and a few links to reports on the left side, and iframe on the right side. When a link on the left is clicked, the iframe loads the report. I was using this sample.
<asp:Content ID="BodyContent" ContentPlaceHolderID="MainContent" runat="server">
<script type="text/javascript">
// Update embed report
function updateEmbedReport() {
// Check if the embed url was selected
var embedUrl = document.getElementById('<%=tb_EmbedURL.ClientID%>').value;
// To load a report do the following:
// 1: Set the url
// 2: Add a onload handler to submit the auth token
var iframe = document.getElementById('iFrameEmbedReport');
iframe.src=embedUrl;
iframe.onload = postActionLoadReport;
}
// Post the auth token to the iFrame.
function postActionLoadReport() {
// Get the app token.
accessToken = document.getElementById('<%=hidReportAppToken.ClientID%>').value;
// Construct the push message structure
var m = { action: "loadReport", accessToken: accessToken };
message = JSON.stringify(m);
// Push the message.
iframe = document.getElementById('iFrameEmbedReport');
iframe.contentWindow.postMessage(message, "*");
}
</script>
<div style="overflow:hidden; height:100%">
<table width="100%" height="100%" cellspacing="0" cellpadding="0"><tr><td width="300" height="100%" style="background-color:#124C8F" valign="top">
<br />
<div align="center"><img src="images/NMBS-logo.png" width="200" /></div>
<br /><br /><br /><br />
<asp:Panel ID="PanelReports" runat="server" Visible="true">
<table width="100%" cellpadding="4" border="0"><tr><td valign="top">
<asp:PlaceHolder runat="server" ID="ContentReportLinks"></asp:PlaceHolder>
</td></tr></table>
<asp:HiddenField ID="hidReportAppToken" runat="server"></asp:HiddenField>
<input type="hidden" id="tb_EmbedURL" style="width: 1024px;" runat="server" />
</asp:Panel>
</td>
<td>
<iframe ID="iFrameEmbedReport" src="" height="100%" width="100%" frameborder="0" seamless></iframe>
</td></tr></table>
</div>
</asp:Content>