Home/ Questions/Q 8297487
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-06-08T15:26:13+00:00

I’m having trouble opening a dijit.Dialog from another dijit.Dialog. I’ve seen other posts here

  • 0

I’m having trouble opening a dijit.Dialog from another dijit.Dialog. I’ve seen other posts here suggesting that it works fine as of Dojo version 1.5, but I’m using Dojo 1.6.1 and not having much luck. The Dojo documentation at http://dojotoolkit.org/documentation/tutorials/1.7/dialogs_tooltips/ seems to suggest that this is supported where it says, “One important fact to know about dijit/Dialog is that instances are added to a “stack” so that you may have instances on top of one another.”

When I call show() on a second dialog from one that is currently shown, the second dialog is barely visible for a moment and then the browser refreshes, leaving just the first dialog shown.

Here’s a simple example:

<html>
<head>
    <link rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/dojo/1.6.1/dijit/themes/claro/claro.css" />
    <script src="http://ajax.googleapis.com/ajax/libs/dojo/1.6.1/dojo/dojo.xd.js" djConfig="parseOnLoad: true"></script>
    <script type="text/javascript">
        dojo.require("dijit.dijit");
        dojo.require("dijit.Dialog");
        dojo.ready(function () {
            dijit.byId("dialog1").show();
        });
    </script>
</head>
<body class="claro">

    <div data-dojo-type="dijit.Dialog" id="dialog1" data-dojo-props="title:'Dialog 1'">
        I'm dialog 1
        <a href="" onclick="dijit.byId('dialog2').show();">Open dialog 2</a>
    </div>

    <div data-dojo-type="dijit.Dialog" id="dialog2" data-dojo-props="title:'Dialog 2'" style="visibility:hidden;">
        I'm dialog 2
    </div>

</body>
</html>

I have a feeling I’m missing something simple. Can anybody help me out? Ideally dialog1 would stay in the background while dialog2 appears on top of it as a modal dialog.

Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    You have an anchor tag, it fires a document.location.href = "" since the onclick returns true.

    See following:
    Which "href" value should I use for JavaScript links, "#" or "javascript:void(0)"?

    Correct to 

    <a href="javascript:void(0); " 
       onclick="dijit.byId('dialog2').show(); return false ">
                                        <!-- note 'false' -->
 Open dialog 2</a>

    If the onclick returns a true (the .show() does that) , then the expected behavior of an <a> is to be expected, youre clicking a link that will bring you to another page. While the hrefis a blank, then same page is reloaded.

    • 0