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?

score 17 · Answer 1 · edited Oct 20 '15 at 14:34

17

"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()
   }
});

edited Oct 20 '15 at 14:34

Peter Šándor

13
1
6

answered Apr 02 '14 at 11:54

user3489215

171
1
2

1

do you have a link to the documentation you could share with the person asking the question? – Paul Bastide Apr 02 '14 at 12:15
http://dojotoolkit.org/api/ Search for dijit/Dialog and look at the constructor method, we pass params & srcNode – Superdrac Oct 16 '14 at 07:55
1

It doesn't work. There is not even hide() function in dijit/Dialog.js. – peterh Dec 04 '14 at 09:59
This works for me. Any tip on how to pass the dialog to an external function? e.g. `var dialog = new Dialog({ content: form, title: title, onHide: customFunction(dialog)});`. Should I pass `dialog`, `this` or what? – noobsharp May 12 '17 at 08:29

score 9 · Accepted Answer · answered Apr 19 '12 at 13:09

9

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 :-)

answered Apr 19 '12 at 13:09

Thor A. Pedersen

1,122
4
18
32

1

Thank you ! Worked perfectly ! For those which have things in the dialog, don't forget to add a `dijit.byId("user_submit").destroyDescendants();` !!!! – Superdrac Oct 16 '14 at 07:46
2

The recommended destroy method is `destroyRecursive` – JamieJag Jun 11 '15 at 17:19
Late comment: Probably better to connect to "onHide" instead of "hide". "onHide" occurs after any animations are performed, so if one wants to destroy the dialog when it is hidden, "onHide" would be safer to use vs "hide". The hide() method of a dialog starts the process of hiding the dialog, but if animations are enabled, those are executed, with hide() using a promise to trigger "onHide" when animations are complete. – ewh Jun 22 '19 at 22:10

score 3 · Answer 3 · answered Apr 18 '12 at 20:18

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.

answered Apr 18 '12 at 20:18

hugomg

68,213
24
160
246

I connected to the "hide" event and that worked (shortly afterwards, but don't have enough points to post an answer that fast to my own question). But indeed, when optimizing the script I would do all you said. But since im new to Dojo and the "project" had to be done fast, i didn't have the time to think in resource management. – Thor A. Pedersen Apr 19 '12 at 13:08

score 1 · Answer 4 · edited Nov 04 '16 at 14:05

1

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
});

edited Nov 04 '16 at 14:05

Chris

4,593
1
33
37

answered Sep 03 '15 at 07:34

Neelesh

666
6
17

score -1 · Answer 5 · answered Mar 11 '14 at 09:54

-1

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

Dispose of the element there.

answered Mar 11 '14 at 09:54

Nick Hermans

86
3

1

"Developer shouldn't override or connect to this method; it's a private communication device between the TooltipDialog and the thing that opened it (ex: dijit/form/DropDownButton)" - Dojo API documentation https://dojotoolkit.org/api/ > Dijit > _DialogMixin > onCancel – GavinR Sep 04 '14 at 13:17

Dojo dialog close event on X (top-right)

5 Answers5

Linked