Dojo dialog close event on X (top-right)

Question

Im using Dojo to create a simple dialog to create a user in a system. The problem is I get the error:

Tried to register widget with `id==user_submit` but that `id` is already registered

user_submit, is a Dojo button I have to finish the form inside the dialog. When I close the dialog by clicking it and submitting the form there is no problem in opening the dialog again (in the click event on the button I have this line of code:

dijit.byId("user_submit").destroy();

but if I close the dialog through the [x]-link / button in the top-right corner I don't destroy the button and then can't open the dialog again without reloading the page.

How do I get Dojo to destroy the button or how to a overload the click-event on [X]-link / button, so I can write the destroy command for the button?

Answer 1

"Developer shouldn't override or connect to this method" for "onCancel" see documentation. A better solution is:

var myDialog = new Dialog({
   id: "myDialogId1",
   onHide: function() {
      myDialog.destroy()
   }
});

Answer 2

Found a solution. by using dojo.connect().

myDialog.connect(myDialog, "hide", function(e){
    dijit.byId("user_submit").destroy(); 
});

Would have postet this shortly after i posted the quistion, but I didn't have enough points, so here is the answer again, just a little late :-)

Answer 3

IIRC, the onClose extension event gets called when you click on the X thing, so you could try putting your cleanup code there.

---

You could also consider sidesteping the issue entirely. Perhaps you don't need to destroy the widget and could instead reuse the same one? You could also do a widget existence test before you create it again, destroying the old version if its still alive.

Answer 4

You can override onCancel() method as stated above or you can attach event to the dijit.dialog.closeButtonNode domElement. dijit.dialog.closeButtonNode is the name of data-dojo-attach-point attribute for close button.

Exp:

dojo.on(dijit.Dialog.closeButtonNode, "click", function(evt){
      //add your logic here
});

Answer 5

When pressing the X on the top of the dialog the "onCancel" event is triggered.

Dispose of the element there.