Home/ Questions/Q 664747
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-05-13T23:38:01+00:00

In the main gadget html, there is a div with an onclick that calls

  • 0

In the main gadget html, there is a div with an onclick that calls this method in the Gadget script file:

ShowFlyout = function() 
{
    System.Gadget.Flyout.show = true;
    var flyoutDoc = System.Gadget.Flyout.document;
    var mainFlyoutDiv = flyoutDoc.getElementById('divFlyout');
    mainFlyoutDiv.innerHTML = "hello";
}

Here is the Flyout html:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html>
<head>
    <title>This is a flyout</title>
    <link href="Css\FlyoutStyle.css" type="text/css" rel="Stylesheet" />
</head>
<body>
    <div id="divFlyout" >
    </div>
</body>
</html>

The problem is that mainFlyoutDiv is always null. When peering into the System.Gadget.Flyout.document object through the debugger, the body parameter is null – I don’t think that’s right. The System.Gadget.Flyout.file value is being set elsewhere when the gadget first loads.

What am I doing wrong?

Also, does the System.Gadget.Flyout.show property have to be true before the System.Gadget.Flyout.document property can be accessed? My ultimate goal is to open a flyout and dynamically populate it’s html

Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    The problem here is the flyout is loaded asynchronously (because it’s an entirely new window). The line

    var mainFlyoutDiv = flyoutDoc.getElementById('divFlyout');

    is executed before the Flyout document is finished being parsed, which is why it’s null – the element doesn’t exist yet. There’s a couple of options available to you, my favourite being something like this:

    ShowFlyout = function()    
{   
    System.Gadget.Flyout.show = true;   
    var flyoutWin = System.Gadget.Flyout.document.parentWindow;   
    flyoutWin.myCustomVar = "Hello";
}

    And in your flyout HTML, add a script with the following code:

    window.onload = function ()
{
    document.getElementById("divFlyout").innerHTML = myCustomVar;
}
    • 0