Showing results for 
Search instead for 
Did you mean: 
Helper I
Helper I

How to reuse the Powerbi.Embed to load the same report in Modal Popup

Hi All,


I am using Powerbi.Embed to authenticate  the Power bi report using Azure AD and loading the report in my own application.

Here i have provided option to load the same report in Modal Popup to show report in full screen.


Below is my javascript code:

 var config = {
                        type: 'report',
                        tokenType: models.TokenType.Embed,
                        accessToken: aadPBIToken,
                        embedUrl: aadPBIEmbdUrl,
                        id: aadPBIRptID,
                        permissions: models.Permissions.All,
                        settings: {
                            filterPaneEnabled: true,
                            navContentPaneEnabled: true,
                    var reportContainer = $('#reportContainer')[0];
                    var report = powerbi.embed(reportContainer, config);

 $("#anchMak").click(function () {
          { content: '<embed id="iFrameModalContainer" width="1300" height="700" src="' + aadPBIEmbdUrl + '"></embed>' });

As we can see in above code on achor button click i am opening the modal and passing the PowerbiEmbedUrl in modal content.

But reports are not loading.


Please suggest to make it work.


Helpful resources

UG GA Amplification 768x460.png

Launching new user group features

Learn how to create your own user groups today!

November Power BI Update 768x460.png

Check it Out!

Click here to read more about the November 2021 Updates!

M365 768x460.jpg

Microsoft 365 Collaboration Conference | December 7–9, 2021

Join us, in-person, December 7–9 in Las Vegas, for the largest gathering of the Microsoft community in the world.