dijit单个对话框页面控件

时间:2015-07-31 21:08:59

标签: dojo dialog attributes

我创建了一个dijit.Dialog并在需要时显示/隐藏。但是现在我需要跟踪控制,因为我有时无法解开屏幕。我把所有" dialog.show/hide"进入一个函数调用,我有如下所示。但是说dialog00Reg是未定义的。为什么?有什么更好的方法呢?

  function dialogState(obj,state){
    var dialog00Reg;
    require(["dijit/registry"], function(registry){
      dialog00Reg= registry.byId(obj);
       if(state=="show"){
         if(!(dialog00Reg.open)){
           dialog00Reg.show();
         }
       }
       if(state=="hide"){
         if(dialog00Reg.open){
           dialog00Reg.hide();
         }
       }
    });
  }

1 个答案:

答案 0 :(得分:1)

管理对话框的方式取决于页面的结构。一种方法是做类似以下的事情。这假设您通过事件处理程序控制对话框。

<html>
    <head>
        <!-- head tags ... -->

        <script src="somewhere/dojo.js" data-dojo-props="async:true"></script>
    </head>
    <body>
        <!-- tags ... -->

        <script>
            require([
              'dojo/on',
              'dijit/Dialog',
              ...
            ], function (on, Dialog, ...) {
                var dialog;

                on(document.getElementById('showButton'), 'click', function () {
                    if (!dialog) {
                        // Create the dialog if it doesn't already exist
                        dialog = new Dialog({ ... });
                    }
                    dialog.show();
                });

                on(document.getElementById('hideButton'), 'click', function () {
                    if (dialog) {
                        dialog.hide();
                    }
                });

                ...
            });
        </script>
    </body>
</html>

在此示例中,单个脚本管理对话框创建以及与对话框交互的所有侦听器。由于此处创建了对话框,因此很容易保留对它的引用,因此侦听器永远不必搜索它。

如果您的对话框是在其他地方创建的,并且您知道对话框的ID,则可以执行原始示例。但是,将该功能放在需要它的处理程序中会更简单,更像是:

<html>
    <head>...</head>
    <body>
        ...
        <script>
            require([ 'dojo/on', 'dijit/registry' ], function (on, registry) {
                var dialogId = 'myDialog';

                on(document.getElementById('showButton'), 'click', function () {
                    var dialog = registry.byId(dialogId);
                    if (dialog) {
                        dialog.show();
                    }
                });
                on(document.getElementById('hideButton'), 'click', function () {
                    var dialog = registry.byId(dialogId);
                    if (dialog) {
                        dialog.hide();
                    }
                });
            });
        </script>
    </body>
</html>

您并不需要担心跟踪状态,因为在已经可见的对话框上调用show或在隐藏的对话框上调用hide无效。