A Dojo Confirmation Dialog

By Chris L Hardin
Sr. Software Architect

One of the things that is going to included in an upcoming release of the Dojo framework is a popup confirmation dialog like you have in Javascript. This should have already been included in the framework, but we won’t get into that… Until this functionality is actually released, I decided to write my own confirmation dialog since I had a realtime need to have one and the version that is going to be included in the future Dojo release is not at a stage of completion that allowed me to use it.

In a lot of ways, the answer I came up with was really clean. Here is the method.

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

function confirmDialog(title, question, callbackFn, e) {

var errorDialog = new dij.Dialog({ id: 'queryDialog', title: title });

var callback = function(mouseEvent) {

errorDialog.hide();
errorDialog.destroyRecursive();

if (window.event) e = window.event;

var srcEl = mouseEvent.srcElement? mouseEvent.srcElement : mouseEvent.target; //IE or Firefox

if (srcEl.id == 'yes') {
callbackFn(true, e);
} else {
callbackFn(false, e);
}
};
var questionDiv = dojo.create('div', { innerHTML: question });
var yesButton = new dij.form.Button(
{ label: 'Yes', id: 'yes', onClick: callback });
var noButton = new dij.form.Button(
{ label: 'No', id: 'no', onClick: callback });

errorDialog.containerNode.appendChild(questionDiv);
errorDialog.containerNode.appendChild(yesButton.domNode);
errorDialog.containerNode.appendChild(noButton.domNode);
errorDialog.show();
}

//utilize the method like this
dialogConfirm("Confirm Change", "Are you sure you want to change?", cancelConfirmCallback, e);

This is pretty straight forward and it works great for those annoying Vista-like popups like, “Are you sure you want to do this?” or “Are you really sure you want to do this?” and everyone’s favorite, “Are you real, really, cross your heart and hope to die, sure that you want to do this?”

Follow

Get every new post delivered to your Inbox.