如何从封闭的小部件以编程方式打开从dijit / _HasDropDown继承的dojo小部件?

时间:2016-09-20 13:18:18

标签: javascript dojo

我有以下自定义dojo小部件:

<div class="${baseClass}">
    <div data-dojo-type="dijit/TitlePane" data-dojo-props="title:'${prefixTitle}', open:false" id="titleNodePane">
        <div id="container"
        class="${baseClass}Container"
        data-dojo-attach-point="containerNode"></div>
    </div>
</div>

使用此代码:

/**
 * Javascript for ExpandableSearchComponent
 */
define([ "dojo/_base/declare", "dijit/_WidgetBase", "dijit/_TemplatedMixin",
        "dojo/text!./templates/ExpandableSearchComponent.html",
        "dijit/TitlePane", "dijit/_WidgetsInTemplateMixin", "dijit/registry",
        "dojo/on", "dojo/aspect", "dojo/_base/lang" ], function(declare,
        _WidgetBase, _TemplatedMixin, template, TitlePane,
        _WidgetsInTemplateMixin, registry, on, aspect, lang) {

    return declare([ _WidgetBase, _TemplatedMixin, _WidgetsInTemplateMixin ], {
        templateString : template,
        prefixTitle : "",
        containedWidgetId : "",
        that : this,

        startup : function() {
            this.inherited(arguments);
            var containedWidget = registry.byId(this.containedWidgetId);
            var titlePane = registry.byId("titleNodePane");
            this.own(on(titlePane, "Show", function() {

                containedWidget.openDropDown();

            }.bind(containedWidget)));
            //Other logic

        }
    });

});

声明如下:

<div data-dojo-type="js/widgets/ExpandableSearchComponent"                                  
    data-dojo-props="prefixTitle: 'Name: ', containedWidgetId: 'machineSearchView.name'">   
<!-- Other elements including the machineNameStore-->                                                          
    <div data-dojo-type="dijit/form/ComboBox"                                               
        data-dojo-props="store:machineNameStore, searchAttr:'name', value:'${MachineName}'" 
        name="machineSearchView.name" id="machineSearchView.name"></div>                    
</div>                                                                                      

它的工作几乎完美,除了一件事:on(titlePane, "Show", function(){})。这是为了打开包含的小部件的下拉列表,扩展_HasDropDown。我在_HasDropDown的第139行收到错误Uncaught TypeError: Cannot read property 'domNode' of null。显然,在TitlePane完全展开之前,不会设置this.dropDown,这会中断openDropDown()

有没有办法解决这个问题?

1 个答案:

答案 0 :(得分:1)

_HasDropDown mixin还有一个loadAndOpenDropDown()函数,如果它不存在则会创建下拉列表然后打开它。

相关问题