Skip to main content
cancel
Showing results for 
Search instead for 
Did you mean: 

Get certified in Microsoft Fabric—for free! For a limited time, get a free DP-600 exam voucher to use by the end of 2024. Register now

Reply
asbpowerbi
Helper IV
Helper IV

Hide a page based on measure value

Hello,

 

  I am using power BI Reporting. I created a report and would like to hide the pages, based on the value in a measure. If the measure is 1 then hide the page named Service, if the measure is 2 hide the Summary and Service pages, etc. How is this done?

 

Cheers,

 

Peter

4 REPLIES 4
chonchar
Helper V
Helper V

Hi,

 

I am pretty new here. Maybe you could research some of the button/bookmark options and create rules based on them. I am not sure how exactly to do that, but maybe that points you in the right direction.

 

Best of luck,

 

Cam

christinepayton
Super User
Super User

This is not a feature of Power BI. If you explain more about the context, there may be another way to achieve the effect you're looking for though (e.g. hiding visuals instead of pages). Bookmarks will let you hide multiple visuals at a time, so you could use field parameters and/or bookmarks for a dynamic element. 

Thank you all for the quick replies!

 

Currently I have a report and am pssing in a filter. The report is embeded in a web page. Based on the passed in filter I want to hide certain pages in the report. My report pages each have names. So when a filter value of 'Sam' is passed in, I want to hide the values page. When a filter of 'Bob' is passed in I want to show the Values page and hide the CustomerCost page. The visuals on the pages show content that is specific to that page. If I try to hide the visuals, as suggested about, the page still appears to the user, but there is nothing on it. I hope that helps describe my project.

 

Sincerely,

 

Peter

@asbpowerbi 

 

To achieve the functionality you described, where you want to dynamically show or hide report pages in Power BI based on a passed-in filter, you can use Power BI's JavaScript API in combination with some custom code on your web page.

Here's a general outline of the steps you would need to follow:

  1. Embed the Power BI Report:

    • Embed the Power BI report into your web page using the Power BI JavaScript API. Make sure you have the necessary JavaScript libraries and configurations set up to display the report.
  2. Set Up a Filter:

    • Implement a mechanism on your web page to allow users to select a filter value (e.g., 'Sam' or 'Bob').
  3. JavaScript Code for Page Visibility:

    • Write JavaScript code that listens for changes in the selected filter value.
    • Based on the selected filter value, use the Power BI JavaScript API to show or hide specific report pages. You will need to use the powerbi.embed object and the updateSettings method.

    Here's an example of what the JavaScript code might look like:

    javascriptCopy code
    // Get a reference to the embedded report const reportContainer = document.getElementById('reportContainer'); // Replace with your container ID const report = powerbi.embed(reportContainer, config); // Listen for changes in the filter selection const filterSelect = document.getElementById('filterSelect'); // Replace with your filter input/select element filterSelect.addEventListener('change', function () { const selectedFilterValue = filterSelect.value; // Define which pages should be hidden or shown based on the filter value const pagesToShow = []; const pagesToHide = []; if (selectedFilterValue === 'Sam') { pagesToHide.push('CustomerCost'); // Hide the CustomerCost page } else if (selectedFilterValue === 'Bob') { pagesToShow.push('Values'); // Show the Values page pagesToHide.push('CustomerCost'); // Hide the CustomerCost page } // Update the report settings to show/hide pages report.updateSettings({ filterPaneEnabled: false, // Hide the filter pane navContentPaneEnabled: true, // Show the navigation pane layoutType: models.LayoutType.Custom, // Use custom layout customLayout: { displayOption: models.DisplayOption.FitToWidth, // Adjust the display option as needed pagesToShow: pagesToShow, pagesToHide: pagesToHide } }); });
  4. HTML Elements:

    • Ensure that you have the necessary HTML elements, such as a container for the report, a filter input/select element, and any other UI elements you require.

This code listens for changes in the filter selection, and based on the selected filter value, it specifies which report pages to show and hide using the updateSettings method of the Power BI JavaScript API. This way, you can dynamically control the visibility of report pages based on the selected filter value.

Make sure to adapt the code to match your specific HTML structure, IDs, and the report configuration you have.

Helpful resources

Announcements
November Carousel

Fabric Community Update - November 2024

Find out what's new and trending in the Fabric Community.

Live Sessions with Fabric DB

Be one of the first to start using Fabric Databases

Starting December 3, join live sessions with database experts and the Fabric product team to learn just how easy it is to get started.

Las Vegas 2025

Join us at the Microsoft Fabric Community Conference

March 31 - April 2, 2025, in Las Vegas, Nevada. Use code MSCUST for a $150 discount! Early Bird pricing ends December 9th.

Nov PBI Update Carousel

Power BI Monthly Update - November 2024

Check out the November 2024 Power BI update to learn about new features.