I'd like to add a dijit/ConfirmDialog prior to closing a widget of type dockable-panel. So I would like to overwrite the onClose event. Thoughts on how to do this. If I add the ConfirmDialog to onClose(), its too late to close it. Has anyone done this? I can probably hide the close button and add my own. Examples of this?
Solved! Go to Solution.
Karen,
You will find that this answers your question:
Edits to the OnScreenWidgetPanel.js file.
define(['dojo/_base/declare',
'dojo/_base/lang',
'dojo/_base/html',
'dojo/on',
'dojo/dnd/move',
'dijit/_TemplatedMixin',
'jimu/BaseWidgetPanel',
'jimu/utils',
'dojox/layout/ResizeHandle',
'dijit/ConfirmDialog',
'dojo/touch'
],
function(
declare, lang, html, on, Move,
_TemplatedMixin, BaseWidgetPanel, utils, ResizeHandle, ConfirmDialog
) {
.....
_confirmClose: function(){
this.myDialog.show();
},
_onCloseBtnClicked: function(evt) {
console.info(this);
if(this.label === 'Draw'){ //this is where you define which widget
this._confirmClose();
return;
}
this.panelManager.closePanel(this);
evt.stopPropagation();
//avoid to touchEvent pass through the closeBtn
if (evt.type === "touchstart") {
evt.preventDefault();
}
},
Karen,
Are you looking to change the behavior for all widget or just a certain one?
Just a certain one (not all). Thanks.
Karen,
You will find that this answers your question:
Edits to the OnScreenWidgetPanel.js file.
define(['dojo/_base/declare',
'dojo/_base/lang',
'dojo/_base/html',
'dojo/on',
'dojo/dnd/move',
'dijit/_TemplatedMixin',
'jimu/BaseWidgetPanel',
'jimu/utils',
'dojox/layout/ResizeHandle',
'dijit/ConfirmDialog',
'dojo/touch'
],
function(
declare, lang, html, on, Move,
_TemplatedMixin, BaseWidgetPanel, utils, ResizeHandle, ConfirmDialog
) {
.....
_confirmClose: function(){
this.myDialog.show();
},
_onCloseBtnClicked: function(evt) {
console.info(this);
if(this.label === 'Draw'){ //this is where you define which widget
this._confirmClose();
return;
}
this.panelManager.closePanel(this);
evt.stopPropagation();
//avoid to touchEvent pass through the closeBtn
if (evt.type === "touchstart") {
evt.preventDefault();
}
},
Thanks Robert. This is the correct answer. I appreciate your help....
But the only issue I see in using this methodology is as follows: From a maintenance standpoint, this is a little tricky. If switching to a new version of the API and re-generating my code from the template, this functionality will break.
I found the style for the close button in FoldableTheme\panels\FoldablePanel\style.css (.jimu-foldable-panel .close-btn). I may try to place a version of the close button on top of the out of the box close button (and maybe hide the OOB close button). I'll post this when I get it working.
Thanks a bunch!!