Search code examples
dojodom-events

Keeping access to the web page even when dijit.dialog appears

Problem I am facing is that when I activate the dijit.dialog(), the web page blurs and I can not connect with the page till I close the dialog box. Is there some way that I can keep the dialog box open and still access the page. By access I mean that the web page should be able to listen to click events or things like that. If not is there some other tool that I can use?

Solution

  • Consider dojox/layout/FloatingPane because dijit/Dialog is quite hard-wired to be modal (via singletons):

    // var FloatingPane = require("dojox/layout/FloatingPane");
var floatingPane = new FloatingPane({
    title: "FloatingPane",
    content: "Hello World!",
    resizable: false,
    dockable: false
}, "floatingPane");

floatingPane.startup();

    or if you insist on dijit/Dialog you can subclass it, but expect possible weird stuff, esp. when nesting and/or combining modal/non-modal dialogs:

    // var Dialog = require("dijit/Dialog");
var ModelessDialog = declare(Dialog, {
    show: function() {
        this.inherited(arguments);
        Dialog._DialogLevelManager.hide(this);                      
    }
});

    See it in action at jsFiddle: http://jsfiddle.net/phusick/TgEWL/

    N.B.: Do not forget to include dojox/layout/resources/FloatingPane.css and dojox/layout/resources/ResizeHandle.css stylesheets when using FloatingPane.