I'm currently displaying a form inside a dialog, and am using dijit.form.ValidationTextBox that displays a tooltip when the input is not valid.
I've also changed the dialog cancel (x) button to destroy the dialog instead of hiding it (.destroyRecursive()), so that I can open it again (programmatically) and not get a 'Tried to register widget with id==Dialog2 but that id is already registered' error.
Now if the tooltip is currently displaying from the 'ValidationTextBox' input field and the user then clicks on the (x) cancel button in the dialog, the tooltip will continue to display and is left on the screen.
I think this is a bug, as if I destroy the dialog by using 'dijit.byId('Dialog2').destroyRecursive();' by attaching it to a 'dijit.form.Button' onClick() inside the dialog, then everything works fine and the tooltip hides itself.
So how can I get the 'ValidationTextBox' tooltip to hide when the dialog is destoryed by clicking on the (x) cancel button ??
I am using : dojo version 1.1 from : http://o.aolcdn.com/dojo/1.1/dojo/dojo.xd.js
I've taken the example code from http://turtle.dojotoolkit.org/~dmachi/examples/DialogExamples.html
and modified it to show the problem.
dojo.require("dojo.parser");
dojo.require("dijit.Dialog");
dojo.require("dijit.form.Button");
dojo.require("dijit.form.ValidationTextBox");
function closeDialog(){
//Code to destory the dialog and everything in it.
dijit.byId('Dialog2').destroyRecursive();
console.log('closeDialog function called');
}
function createAndShowDialog(){
var dialog2 = new dijit.Dialog({id:"Dialog2", title: "Dialog2"});
var dialogContent = 'Clicking on these buttons will show a console.log message, then the dialog gets destroy()ed. It is destroyed instead of being hidden for this example so that the creat button can be used againOKCancel';
var sBugContent = 'Enter some numbers into this field to get the validation tooltip to show. Then while the validation message is still showing, click on the cancel dialog button (x) in the top right. The validation message will not disappear when trying to destory the dialog box so that it can be used again.While the "OK" and "Cancel" buttons will work correctly.';
dialogContent = dialogContent + sBugContent;
dialog2.setContent(dialogContent);
dojo.body().appendChild(dialog2.domNode);
dialog2.show();
dojo.connect(dialog2, 'hide', 'closeDialog');//Connect to the hide event
}
<button dojoType="dijit.form.Button" onclick="createAndShowDialog();">Create & Show Dialog2 (programmatically) </button>
</body>
As a side note, if the user clicks on the title bar of the dialog and drags the dialog while the tooltip is displaying, then the 'ValidationTextBox' tooltip does not hide, this might be part of the same problem due to the location of the (x) dialog cancel button also being in the title bar drag area.
So to repeat my question after all that is:
How can I get the 'ValidationTextBox' tooltip to hide when the dialog is destoryed by clicking on the (x) cancel button ??
Tested on browser version: FF 2.0
Many thanks
- Login or register to post comments
- Unsubscribe post

Same problem - ideally tooltips should be hidden with the dialog
I have the same problem, though it also occurs if you hide the dialog instead of destroy it. So ideally tooltips would automatically hide when the dialog is hidden or destroyed.