通过继承_HasDropdown和_AutoCompleterMixin来定制dojo下拉菜单

问题描述

我正在尝试自定义下拉列表，它会查询我自己的一些服务，并相应地更新其下拉菜单。我正在关注但是没有描述如何创建下拉容器的dom。

I am trying to do a Custom Dropdown that will query some of My Own service and update its Drop Down Menu accordingly. I am following the example on http://livedocs.dojotoolkit.org/dijit/_HasDropDown But that doesn't describe how to create the dom for dropdown container.

我需要设置 this.dropDown 到 ctor 中的一些 dijit._Widget ？
如果需要先创建另一个 dijit._widget 如果是，我知道如何更新值通过 data-dojo-attach-point 但是，如果下拉，它将是一个集合需要更新。在这种情况下，dojo中有没有可以处理集合的这样的工具？否则手动处理清除/填充/事件处理在每个这个下拉单元将容易弄乱。

Do I need to set this.dropDown to some dijit._Widget in ctor ?If another dijit._widget needs to be created first ? If yes I know How to update values By data-dojo-attach-point But in case of drop down it will be a collection that needs to be updated. Is there any such tool in dojo that can handle collections for this kind of situation ? otherwise manually handling clearing/filling/event-handleing on each of this dropdown elements will easily get messy.

推荐答案

我创建了一个自定义的窗口小部件，这是窗体上显示的。在这个小部件中，我覆盖 openDropDown 和 closeDropDown 函数。在我的情况下，下拉菜单是非常复杂的，以便在每次用户

I created a custom widget that is what is displayed on the form. Within this widget, I override the openDropDown and closeDropDown functions. In my case, the dropdown was complex enough that it was easier to destroy it on close and recreate each time the user

dojo.declare("TextboxWithCustomDropdown",
    [dijit.form.ValidationTextBox, dijit._HasDropDown], {

    openDropDown: function() {
        if(!this.dropDown) {
            var _s = this;

            this.dropDown = new MyCustomDropDown({...});
            this.dropDown.connect(this.dropDown, 'onChange', function(val) {
                _s.closeDropDown();
                _s.attr('value', val);
            });
        }
        this.inherited(arguments);
    },
    closeDropDown: function() {
        this.inherited(arguments);
        if (this.dropDown) {
            this.dropDown.destroy();
            this.dropDown = null;
        }
    }
});

dojo.declare("MyCustomDropDown", [dijit._Widget, dijit._Templated], {

    templateString: ...

    // when the user makes their selection in the dropdown, I call the onChange
    // function, and the textbox is listenting on this
    onChange: function(/*Object*/ value) {}
}

这篇关于通过继承_HasDropdown和_AutoCompleterMixin来定制dojo下拉菜单的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！