我有一个内置表格的Dialog。以下代码只是我正在尝试做的一个例子。当你关闭一个dijit.Dialog时,如果你不能递归地销毁他的孩子,你就不能重新打开它(具有相同的id)。
如果您不想销毁小部件,可以执行以下操作:
var createDialog = function(){
try{
// try to show the hidden dialog
var dlg = dijit.byId('yourDialogId');
dlg.show();
} catch (err) {
// create the dialog
var btnClose = new dijit.form.Button({
label:'Close',
onClick: function(){
dialog.hide();
}
}, document.createElement("button"));
var dialog = new dijit.Dialog({
id:'yourDialogId',
title:'yourTitle',
content:btnClose
});
dialog.show();
}
}
我希望这可以提供帮助但是使用此代码时抛出的错误是:
exception in animation handler for: onEnd (_base/fx.js:153)
Type Error: Cannot call method 'callback' of undefined (_base/fx.js:154)
我不得不说我有点迷失这个!它让我发疯了^^
PS:对不起我的“法语”英语^^
答案 0 :(得分:3)
我会向您介绍您最好的朋友:dojo.hitch()
这允许您将onClick
函数绑定到创建它的上下文。当您按下代码中的按钮时,它可能会在您的.show()
.hide()
表单中调用全局窗口的上下文。 var dlg
绑定到createDialog
函数,因此全局窗口无法看到它的内部,因此全局窗口将其视为undefined
。
以下是我更改为代码的示例:
var createDialog = function(){
// try to show the hidden dialog
var dlg = dijit.byId('yourDialogId');
dlg.show();
// create the dialog
var btnClose = new dijit.form.Button({
label:'Close',
onClick: function(){
dojo.hitch(this, dlg.hide());
}
}, document.createElement("button"));
dlg.domNode.appendChild(btnClose.domNode);
var btnShow = new dijit.form.Button({
label : 'Open',
onClick : function() {
dojo.hitch(this, dlg.show());
}
}, document.createElement("Button"));
dojo.body().appendChild(btnShow.domNode);
};
dojo.ready(function() {
createDialog();
});
请注意使用dojo.hitch()
将各种按钮的任何未来调用或点击绑定到创建dlg
的上下文,永远授予按钮的onclick
方法访问权限在createDialog
函数内部,var dlg
存在。
答案 1 :(得分:0)
嗨,如果我理解正确,你不需要每次都销毁dijit.Dialog。 E.g:
HTML:定义简单按钮:
<button id="buttonTwo" dojotype="dijit.form.Button" onclick="showDialog();" type="button">
Show me!
</button>
使用Javascript:
// required 'namespaces'
dojo.require("dijit.form.Button");
dojo.require("dijit.Dialog");
// creating dialog
var secondDlg;
dojo.addOnLoad(function () {
// define dialog content
var content = new dijit.form.Button({
label: 'close',
onClick: function () {
dijit.byId('formDialog').hide();
}
});
// create the dialog:
secondDlg = new dijit.Dialog({
id: 'formDialog',
title: "Programatic Dialog Creation",
style: "width: 300px",
content: content
});
});
function showDialog() {
secondDlg.show();
}
请参阅Example和reed dijit.dialog