Dashboard menu not closed when switched to listing page on embedding
Are you embedding a dashboard into a web page and noticing that the menu doesn’t close when you switch to a listing page? In this guide, we’ll show you how to resolve this issue.
Problem
The Dashboard menu popup doesn’t close when switching to the listing page or clicking on the application in an embedded environment.
Solution
This issue occurs because the dashboard root element gets removed when clicking the back button or navigating to the dashboard listing page. To resolve this issue, you need to destroy the dashboard instance before removing the dashboard container. This will remove the dependent DOM elements created in the body tag, including the menu popup.
Here’s a code snippet to destroy the dashboard instance in your embedded application:
var biInstance = BoldBI.getInstance('dashboard-render'); // 'dashboard-render' denotes embedContainerId used in BoldBI.create()
biInstance.destroy();
By implementing this code snippet, the Dashboard menu popup will close properly when switching pages or clicking on the application in your embedded environment.