如何在dojo对话框中找到按钮?

时间:2015-07-08 10:16:36

标签: html button dojo

我在javascript和dojo中。基于我的previous question关于非底衬的对话框,我创建了一个对话框。现在我想将我的按钮添加到对话框中。按钮是dojo按钮,所有按钮都在。我怎样才能在对话框中找到这些?

require(["dijit/Dialog", "dijit/DialogUnderlay", "dojo/domReady!"], function(Dialog, DialogUnderlay){
    //just for the snippets to get the right styling
    document.body.className = "tundra";




    myDialog2 = new Dialog({
        title: "My Dialog",
        content: "Test content.",
        style: "width: 300px"
    });

    showDialog2 = function () {
       myDialog2.show().then(function() {
            DialogUnderlay.hide()
            //little hack to avoid JS error when closing the dialog
            DialogUnderlay._singleton.bgIframe = {destroy: function() {}} 
       });
    }

});
<button onclick="showDialog2();">show without underlay</button>

<div id="navtool" >


      <div data-dojo-type="dijit/form/Button" id="zoomin"  >Zoom In</div>
      <div data-dojo-type="dijit/form/Button" id="zoomout" >Zoom Out</div>
      <div data-dojo-type="dijit/form/Button" id="zoomfullext" >Full Extent</div>
      <div data-dojo-type="dijit/form/Button" id="zoomprev" >Prev Extent</div>
      <div data-dojo-type="dijit/form/Button" id="zoomnext" >Next Extent</div>
      <div data-dojo-type="dijit/form/Button" id="pan" >Pan</div>
      <div data-dojo-type="dijit/form/Button" id="deactivate" >Deactivate</div>

     </div>

2 个答案:

答案 0 :(得分:1)

最简单的方法似乎是编程这样的html代码:

 var setContent = "<div data-dojo-type="dijit/form/Button" id="zoomin"  >Zoom In</div>";
                setContent += "<div data-dojo-type="dijit/form/Button" id="zoomout" >Zoom Out</div>";
                setContent += "<div data-dojo-type="dijit/form/Button" id="zoomfullext" >Full Extent</div>";

在定义对话框之前,然后使用您的变量设置Dialog的内容:

  myDialog2 = new Dialog({
    title: "My Dialog",
    content: setContent ,
    style: "width: 300px"
});

答案 1 :(得分:1)

如果您将domNode提供给content的{​​{1}}属性,则dojo将放置该节点并为您启动小部件。

&#13;
&#13;
dialog
&#13;
require(["dijit/Dialog", "dijit/DialogUnderlay", "dojo/dom", "dojo/domReady!"], function(Dialog, DialogUnderlay, dom){
    //just for the snippets to get the right styling
    document.body.className = "tundra";
  

  
    myDialog2 = new Dialog({
        title: "My Dialog",
        content: dom.byId('navtool'),
        style: "width: 300px"
    });
  
    showDialog2 = function () {
       myDialog2.show().then(function() {
            DialogUnderlay.hide()
            //little hack to avoid JS error when closing the dialog
            DialogUnderlay._singleton.bgIframe = {destroy: function() {}} 
       });
    }

});
&#13;
&#13;
&#13;