cancel
Showing results for 
Search instead for 
Did you mean: 
Reply
GOInside
New Member

Javascript Power BI

Hi,

 

I'm embeding a Power BI report through Liquid.

When I'm using the authenticationtype pbiEmbedded, the javascript is recognized perfectly, but when I switch to AAD, it doesn't work.

Someone with the same problem?

 

I assume the problem is the var $(".powerbi")[0]; but I don't know how to put it correctly at the Portal

 

$(function(){
    var embedContainer = $(".powerbi")[0];
    var report = powerbi.get(embedContainer);
    report.on("loaded", function(){
        report.updateSettings({
            panes: {
                filters :{
                    visible: false
                },
                pageNavigation:{
                    visible: false
                }
            }
        }).catch(function (errors) {
            console.log(errors);
        });
    })
    report.on('dataSelected', function(event){
        console.log('Event - dataSelected:');
        console.log(event.detail);
    })
})

 

 

8 REPLIES 8
ragavanrajan
Super User
Super User

Hi @GOInside 

I have tested this and it is working properly, please try the below code 

 

{% powerbi authentication_type:"aad" path:"https://app.powerbi.com/groups/yourgroupid/reports/reportid/ReportSectionf69279fd235144cf118a"   %}

 

Note: The JavaScript you are using is to only enable and disable the filter, there is no relation for authentication type. 

 


Hope it helps. 
------------

If you like this post, give it a Thumbs up. Where it solved your request, Mark it as a Solution to enable other users to find it.

 

 

GOInside
New Member

The report works perfectly. I just want to hide the filters and navigation bar, and later activate the actionBar, but for that the javascript will have to work correctly, which doesn't happen if I change pbiembedded to AAD.

Hi @GOInside 

 

Try the following JavaScript 

 

$(document).ready(function () {
    console.log(555, "Power BI filter test");
    var embedContainer = $(".powerbi")[0];
    if (embedContainer) {
        var report = powerbi.get(embedContainer);
        report.on("loaded", function () {
            report.updateSettings({
                panes: {
                    filters: {
                        visible: false
                    },
                    pageNavigation: {
                        visible: false
                    }
                }
            }).catch(function (errors) {
                console.log(errors);
            });
        })
    }
});

 

Note: Check inspect element and in the console you can see the log which I have added in the script (line 2) 

 

Add the above script in web page > Localized content > Advanced > Custom javascript 

 

In portal studio

1. Sync config and browse the website and hit ctrl + F5 ( hard refresh). 

 

I can see the script is loading without any error and hiding the filters. 

 

Hope it helps. 
------------

If you like this post, give it a Thumbs up. Where it solved your request, Mark it as a Solution to enable other users to find it.

Hi @ragavanrajan ,

 

If I choose the option for Organization, I get the following error. If I choose for Customers it works fine. What I intend to do is use for Organization and then add actionBars that only work for Organization.

 

GOInside_1-1641806662038.png

 

GOInside_3-1641807591491.png

 

GOInside_0-1641806619142.png

 

GOInside
New Member

Any suggestions to get javascript working in AAD?

Hi @GOInside 

 

The script I provided was using AAD. I don't get any error on my console if I switch to the organization. 

 

I can see your portal language is different. Did you add the script in the proper place?  Below is the right place 

 

Add the above script in web page > Localized content > Advanced > Custom javascript   

 

If everything is correct. Then In portal studio> Sync config> Browse the website > Hit Ctrl + F5

 

Note: Make sure you don't have any adblockers or different extensions. 

 

Hope it helps. 
------------

If you like this post, give it a Thumbs up. Where it solved your request, Mark it as a Solution to enable other users to find it.

 

GOInside
New Member

Hi @ragavanrajan ,

 

I put it in the right place, because if I change it from AAD to pbiembedded it works. I found an alternative, putting references in the link such as:


&filterPaneEnabled=false
&actionBarEnabled=true
&bookmarksPaneEnabled=true

 

GOInside_0-1642067173723.png

 

I'm wondering if in AAD for being an IFRAME if microsoft doesn't block these javascript references...

Hi @GOInside 

 

As mentioned, I am not getting any errors when I switch to AAD. Because my portal language is English. 

 

Probably it may be a bug.  Please raise a helpdesk ticket with Microsoft. 

 

Hope it helps. 
------------

If you like this post, give it a Thumbs up. Where it solved your request, Mark it as a Solution to enable other users to find it.

Helpful resources

Announcements
Microsoft 365 Conference – December 6-8, 2022

Microsoft 365 Conference – December 6-8, 2022

Join us in Las Vegas to experience community, incredible learning opportunities, and connections that will help grow skills, know-how, and more.

Top Solution Authors
Users online (1,296)