Select2 - 使用select2的amd.require api创建自定义选择元素

时间:2015-12-02 10:54:15

标签: jquery-select2

我正在尝试创建一个自定义select2下拉元素:

  • 有一个搜索字段
  • 将在选择选项后关闭
  • 不会相对于打开/关闭下拉列表的元素(即,您点击的箭头向下的窗格)翻转其位置。

基本上,我喜欢select2的默认行为,除了当下拉列表尝试调整到select2元素下方的可见区域时翻转。我希望select2 始终向下打开。所以在搜索了我能找到的唯一解决方案之后(使用最新版本的select2,目前是4.0.1):

        $.fn.select2.amd.require([
            'select2/utils',
            'select2/dropdown',
            'select2/dropdown/attachContainer',
            'select2/dropdown/closeOnSelect',
            'select2/dropdown/search'
        ], function (Utils, DropdownAdapter, AttachContainer, CloseOnSelect, DropdownSearch) {

            CustomAdapter = Utils.Decorate(
                Utils.Decorate(
                    Utils.Decorate(
                        DropdownAdapter,
                        DropdownSearch
                    ),
                    CloseOnSelect
                ),
                AttachContainer
            );

            this.select.select2({
                dropdownAdapter: CustomAdapter
            });
        }

它几乎可以工作。但是,当我打开下拉列表时,现在我没有在搜索字段中闪烁光标。点击搜索字段也不会显示光标,但键入的字符将显示在搜索字段中,搜索本身也可以。

用户可以开始输入的视觉提示的缺失令人非常恼火,但我无法弄清楚如何解决它。你可以帮帮我吗?或者,如果不这样做,也许你知道一种方法可以防止这种翻转行为而不会出现丑陋的黑客行为并且无需动态重建select2吗?

更新:好的,我认为我必须有一些更深层次的潜在问题,因为即使使用普通的全功能select2,也无法关注搜索领域。

0 个答案:

没有答案