Dojo ConfirmDialog 隐藏取消按钮
Dojo ConfirmDialog hiding cancel button
我有一个道场 ConfirmDialog
如下:
this.myDialog = new ConfirmDialog({
title: "My Dialog",
content: "Do you want to continue?",
class: "confirmDialog",
closable: false
});
// change button labels
this.myDialog.set("buttonOk","Yes");
this.myDialog.set("buttonCancel","No");
// register events
this.myDialog.on("execute", function() {
self.continueSomething()
});
稍后根据某些情况,我正在动态更新 ConfirmDialog
,如下所示:
this.myDialog.set("title", "New Title");
this.myDialog.set("content", "Its too late. Press ok to re-route.");
this.myDialog.set("buttonOk","Ok");
在这个阶段,Cancel
按钮没有任何功能。我该如何隐藏它?
None 以下作品:
this.myDialog.cancelButton.hide();
//or
this.myDialog.cancelButton.set("display", "none");
//or
this.myDialog.cancelButton.set("display", none);
我可以将其禁用为:
this.myDialog.cancelButton.set("disabled", true);
但这看起来不正确。我想完全隐藏 Cancel
按钮。
我该怎么做?
cancelButton
是一个button Dijit
,如果你想隐藏/显示最后一个,
你必须通过简单地输入 this.myDialog.cancelButton.domNode
来访问它的 domNode
并使用 dojo/dom-style
隐藏/显示如下
let cancelBtnDom = this.myDialog.cancelButton.domNode;
domStyle.set(cancelBtnDom, 'display', 'none');
请参阅下面的工作 wnippet(使用外部按钮禁用启用)
require(["dijit/ConfirmDialog", "dojo/dom-style", "dojo/domReady!"], function(ConfirmDialog, domStyle){
myDialog = new ConfirmDialog({
title: "My ConfirmDialog",
content: "Test content.",
style: "width: 300px"
},"dialog");
let cancelBtn = myDialog.cancelButton.domNode;
let switchBtn = document.getElementById("switch");
switchBtn.addEventListener("click",function(){
let display = domStyle.get(cancelBtn, "display") !== "none" ? "none" : "";
console.log(display);
domStyle.set(myDialog.cancelButton.domNode, 'display', display);
});
});
<script src="//ajax.googleapis.com/ajax/libs/dojo/1.10.4/dojo/dojo.js"></script>
<link href="//ajax.googleapis.com/ajax/libs/dojo/1.10.4/dijit/themes/claro/claro.css" rel="stylesheet" />
<body class="claro">
<div class="dialog"></div>
<button onclick="myDialog.show();">show</button>
<button id="switch" >enable/Disable cancel button</button>
</body>
我有一个道场 ConfirmDialog
如下:
this.myDialog = new ConfirmDialog({
title: "My Dialog",
content: "Do you want to continue?",
class: "confirmDialog",
closable: false
});
// change button labels
this.myDialog.set("buttonOk","Yes");
this.myDialog.set("buttonCancel","No");
// register events
this.myDialog.on("execute", function() {
self.continueSomething()
});
稍后根据某些情况,我正在动态更新 ConfirmDialog
,如下所示:
this.myDialog.set("title", "New Title");
this.myDialog.set("content", "Its too late. Press ok to re-route.");
this.myDialog.set("buttonOk","Ok");
在这个阶段,Cancel
按钮没有任何功能。我该如何隐藏它?
None 以下作品:
this.myDialog.cancelButton.hide();
//or
this.myDialog.cancelButton.set("display", "none");
//or
this.myDialog.cancelButton.set("display", none);
我可以将其禁用为:
this.myDialog.cancelButton.set("disabled", true);
但这看起来不正确。我想完全隐藏 Cancel
按钮。
我该怎么做?
cancelButton
是一个button Dijit
,如果你想隐藏/显示最后一个,
你必须通过简单地输入 this.myDialog.cancelButton.domNode
来访问它的 domNode
并使用 dojo/dom-style
隐藏/显示如下
let cancelBtnDom = this.myDialog.cancelButton.domNode;
domStyle.set(cancelBtnDom, 'display', 'none');
请参阅下面的工作 wnippet(使用外部按钮禁用启用)
require(["dijit/ConfirmDialog", "dojo/dom-style", "dojo/domReady!"], function(ConfirmDialog, domStyle){
myDialog = new ConfirmDialog({
title: "My ConfirmDialog",
content: "Test content.",
style: "width: 300px"
},"dialog");
let cancelBtn = myDialog.cancelButton.domNode;
let switchBtn = document.getElementById("switch");
switchBtn.addEventListener("click",function(){
let display = domStyle.get(cancelBtn, "display") !== "none" ? "none" : "";
console.log(display);
domStyle.set(myDialog.cancelButton.domNode, 'display', display);
});
});
<script src="//ajax.googleapis.com/ajax/libs/dojo/1.10.4/dojo/dojo.js"></script>
<link href="//ajax.googleapis.com/ajax/libs/dojo/1.10.4/dijit/themes/claro/claro.css" rel="stylesheet" />
<body class="claro">
<div class="dialog"></div>
<button onclick="myDialog.show();">show</button>
<button id="switch" >enable/Disable cancel button</button>
</body>