Question

I am trying to open a dijit.Dialog when the user clicks on a link.

Furthermore, I want for this dialog to fetch the remote content of the iframe (e.g. the google home page) when the dialog opens and not when the page containing the dialog loads.

Here is the JS:

dojo.require("dijit.Dialog");
dojo.require("dijit.form.Button");


function showDialog() {
    console.log('showDialog');
    dojo.byId('ifr').src = 'http://www.google.fr';
    dijit.byId('dialogOne').show();
}
var link = dojo.byId('link');
dojo.connect(link, 'onclick', showDialog);​

Here is the HTML:

<a href="#" id="link">open link</a>

<div id="dialogOne" data-dojo-type="dijit.Dialog" title="My external dialog">
<iframe id='ifr' width='300px' height='450px'>         </iframe>
</div>​

Here is the jsfiddle: http://jsfiddle.net/8eenG/6/

However, this doesn’t seem to work…

Answer 1

I totally misread your question and went ahead and starting hacking away.

This doesn’t load remote content, but it fixes all of your other problems.

See demo here: http://jsfiddle.net/5uuCX/

Javascript

require(["dojo/parser", "dojo/on", "dojo/dom", "dijit/registry"], 
function(parser, on, dom, registry) {
    parser.parse();
    on(dom.byId("link"), "click", function(e) {
        registry.byId('dialogOne').show();
    });
});​

HTML

<a href="#" id="link">Click to Open Dialog</a>    
<div id="dialogOne" data-dojo-type="dijit/Dialog" title="My external dialog">
    <div id="foo" data-dojo-type="dojox/layout/ContentPane" href="http://fiddle.jshell.net/259fD/show/">    
    </div>
</div>​