Font Size:
Ask Joget AI

Open Links in Dashboard Portlet in Top Window

Introduction

By default, links displayed inside Dashboard portlets in UI Builder may open within an iframe, causing the target page to load inside the portlet instead of the main application window. This article explains how to use a Custom Header script in a Dashboard Menu to force all links inside iframe-based portlets to open in the parent frame.

This approach is useful when embedding pages, reports, or external content in portlets, and you want users to navigate normally within the app.

How does it work?

  1. Open UI Builder and locate the Dashboard Menu that contains the affected portlets.

  2. In the Dashboard Menu, go to Custom Header and add the following code.

    <script type="text/javascript">
    $(function(){
        // Wait for iframe to load
        $('iframe').on('load', function(){
            // Find all links inside the iframe and force them to open in parent frame
            $(this).contents().find("a").attr("target", "_top");
        });
    });
    </script>
    JavaScript
     
  3. Save and Launch the app.

Expected Outcome

Every link found in the portlet will now open in the parent frame. The result below shows a Dashboard portlet displayed within the UI Builder Dashboard. The portlet contains one or more clickable links embedded inside an iframe. At this stage, you can see the links and interact with them by clicking

This screenshot shows the result after a user clicks one of the links in the portlet. Instead of opening inside the iframe, the link is opened in the parent window, allowing the target page to be displayed in the main application view rather than within the portlet.

Related documentation

Download sample app

Download the demo app for Open Portlet Links in Parent Frame:
Created by Marcos Last modified by Debanraj Ravindran on Apr 24, 2026