Check your eligibility for this 50% exam voucher offer and join us for free live learning sessions to get prepared for Exam DP-700.
Get StartedDon't miss out! 2025 Microsoft Fabric Community Conference, March 31 - April 2, Las Vegas, Nevada. Use code MSCUST for a $150 discount. Prices go up February 11th. Register now.
Hi! Can I embed a dashboard and a report and show only the dashboard and when a tile is clicked that the embedded report opens in the page of this one that I want? I mean, by example, I have a dashboard with 2 tiles and a report with 2 pages. Only the dashboard is shown to the client (when he get into the page) and when he clicked on tile 2 that the report opens in the page 2 (i don't know if this can be done modifying the JS of the embedded dashboard).
Solved! Go to Solution.
I just solved this! I used the code to embed Reports and Dashboard simultaneously donwlodable here: Power BI Developer
The code provided by @Eric_Zhang goes in EmbedDashboard.cs like this:
if(clickedTile = 'TILE ID'){ window.open('EmbedReport', '_blank'); }
It opens the EmbedReport.cs and you just need to set the needed configuration to open in the page that you want depending the tile clicked.
@Juramirez wrote:
Hi! Can I embed a dashboard and a report and show only the dashboard and when a tile is clicked that the embedded report opens in the page of this one that I want? I mean, by example, I have a dashboard with 2 tiles and a report with 2 pages. Only the dashboard is shown to the client (when he get into the page) and when he clicked on tile 2 that the report opens in the page 2 (i don't know if this can be done modifying the JS of the embedded dashboard).
The event "tileClicked" of dashboard is for your requirement. You can try
<html> <script src="https://microsoft.github.io/PowerBI-JavaScript/demo/node_modules/jquery/dist/jquery.js"></script> <script src="https://microsoft.github.io/PowerBI-JavaScript/demo/node_modules/powerbi-client/dist/powerbi.js"></script> <script type="text/javascript"> window.onload = function () { // Read embed application token from Model var accessToken = "H4sIAxxxxxCwAA"; // Read embed URL from Model var embedUrl = "https://msit.powerbi.com/dashboardEmbed?dashboardId=66d6daf2-53e7-4f9e-a196-13e88c1cbdde&groupId=dc581184-a209-463b-8446-5432f16b6c15"; // Read dashboard Id from Model var embedDashboardId = "66d6daf2-53e7-4f9e-a196-13e88c1cbdde"; // Get models. models contains enums that can be used. var models = window['powerbi-client'].models // Embed configuration used to describe the what and how to embed. // This object is used when calling powerbi.embed. // This also includes settings and options such as filters. // You can find more information at https://github.com/Microsoft/PowerBI-JavaScript/wiki/Embed-Configuration-Details. var config = { type: 'dashboard', tokenType: models.TokenType.Embed, accessToken: accessToken, embedUrl: embedUrl, pageView: "fitToWidth", id: embedDashboardId }; // Get a reference to the embedded dashboard HTML element var dashboardContainer = $('#dashboardContainer')[0] ; // Embed the dashboard and display it within the div container. var dashboard = powerbi.embed(dashboardContainer, config); dashboard.on("tileClicked", function(event) { var clickedTile = event.detail.tileId; if(clickedTile = '0484db13-1cf5-4820-8309-788e6bb9b80b'){ window.open('http://www.ReportPage1URL.com', '_blank'); } else { window.open('http://www.ReportPage2URL.com', '_blank'); } }); } </script> <p><input type="hidden" id="Textinput" /></p> <div id="dashboardContainer"></div> </html>
Hi @Eric_Zhang. It looks good but :
if(clickedTile = '0484db13-1cf5-4820-8309-788e6bb9b80b'){ window.open('http://www.ReportPage1URL.com', '_blank'); }
What is the token associated to clickedTile? Where can i get it for each tile?
And the url in window.open is from a pubished report, am i wrong? I want this but from a embedding report, how can I do this? I can't see a tutorial for this at the documentation.
Thanks in advance!
Julian
I just solved this! I used the code to embed Reports and Dashboard simultaneously donwlodable here: Power BI Developer
The code provided by @Eric_Zhang goes in EmbedDashboard.cs like this:
if(clickedTile = 'TILE ID'){ window.open('EmbedReport', '_blank'); }
It opens the EmbedReport.cs and you just need to set the needed configuration to open in the page that you want depending the tile clicked.
Sure, what do you need?
@Juramirez i am more of new to embedded reporting . I want to check with you on the steps on implementation since i am not a developer of any code till now . Small code i can work . Will RLS works for embedded reporting?
Hi @Anonymous
Follow all documentation in here https://microsoft.github.io/PowerBI-JavaScript/demo/v2-demo/index.html#
There are example codes which allows you to set your app to use Power BI Embedded and you can see some examples of how it works. In here: https://azure.microsoft.com/es-mx/updates/power-bi-embedded-track-your-free-embed-token-api/ you can see license pricing to have in mind before start implementening Power BI embedded
Regards,
Julian
Hi @Juramirez and @Eric_Zhang,
I am trying to achieve the same by embedding the report in SharePoint Online page.
I am slightly confused about where exactly the html part should go?
Can we edit the Dashboard page in powerBI itself and embed this scriptings? If so should we using powerBI desktop or we can achieve in browser itself
I have raised case in Developer forum for same
Anyhelp regarding this would be highly appreciated.
March 31 - April 2, 2025, in Las Vegas, Nevada. Use code MSCUST for a $150 discount! Prices go up Feb. 11th.
Check out the January 2025 Power BI update to learn about new features in Reporting, Modeling, and Data Connectivity.
User | Count |
---|---|
5 | |
1 | |
1 | |
1 | |
1 |