如何禁用 selectize.js 中的自动过滤？内置/插件/修改源？

Question

我有一个 selectize.js 下拉列表，它使用 ajax 从服务器加载项目列表。服务器提供给定字符串的自动完成，因此我不需要 selectize 的本机过滤。此外，我真的需要将其关闭：服务器输出可能与 selectize 的输出完全不同。

数据被很好地馈送到 JavaScript 个对象中，但 selectize 甚至不显示弹出窗口，因为这些项目与 selectize 的过滤器不匹配。如何禁用或修改本机过滤和匹配突出显示算法？使用内置选项还是使用插件？还是只能去修改源码？

编辑：

searchField：false / function() 不起作用（文档中没有提及它们作为可用的选项值）

编辑2：

最终想到了这个技巧：为每个项目添加一个假字段，为其分配一个搜索字符串并告诉 selectize 将其用作 searchField。但显然，应该有更好的方法，所以问题仍然悬而未决。

Answer 1

所以，搜索代码，我发现，那个 Sifter 模块（searching/sorting 引擎，Selectize 依赖），它确实有一个选项来禁用过滤，我们只需要转发它, 选择。我可以建议以下补丁：

在 Selectize 主 .js 文件中找到函数 getSearchOptions()：

https://github.com/brianreavis/selectize.js/blob/master/dist/js/selectize.js

这是之前的：

getSearchOptions: function () {
    var settings = this.settings;
    var sort = settings.sortField;
    if (typeof sort === 'string') {
        sort = [{field: sort}];
    }

    return {
        fields:      settings.searchField,
        conjunction: settings.searchConjunction,
        sort:        sort
    };
}

这是 之后的内容：（添加了逗号、5 行注释和补丁本身）

...
getSearchOptions: function () {
    var settings = this.settings;
    var sort = settings.sortField;
    if (typeof sort === 'string') {
        sort = [{field: sort}];
    }

    return {
        fields:      settings.searchField,
        conjunction: settings.searchConjunction,
        sort:        sort,
        // A patch to allow to disable native filtering, in the case,
        // when we want to provide search results on the server side.
        // Negative form of the setting is to avoid changing the standard
        // behaviour, (and, possibly, ruining the existing code), when this
        // parameter is missing.
        filter      : !settings.dontFilter
    };
},
...

抱歉，我只是没有时间在 Github 上创建分支，项目截止日期临近，而且，实际上不确定，我现在能否成为一名优秀的贡献者，由于缺乏在 Github 工作的经验。所以，只需发布一个快速解决方法。

Answer 2

我使用这个解决方案（如果服务器的结果排序正确）：

    score: function() { return function() { return 1; }; },

或这个（如果需要订购）

    score: function(search) {
        var score = this.getScoreFunction(search);
        return function(item) {
            return 1 + score(item);
        };
    },

Sifter 使用评分函数进行过滤。得分结果必须 > 0.

Answer 3

我需要禁用搜索，这样 iPhone 就不会显示键盘。我确定的解决方案通过连接到 selectize 设置使搜索字段只读（不修改实际源，因此 selectize 仍然可更新）。这是代码，如果有人需要的话：

// Put this code after you've included Selectize
// but before any selectize fields are initialized
var prevSetup = Selectize.prototype.setup;

Selectize.prototype.setup = function () {
    prevSetup.call(this);

    // This property is set in native setup
    // Unless the source code changes, it should
    // work with any version
    this.$control_input.prop('readonly', true);
};

Answer 4

我在选择参数中用onInitialize方法解决了：

$("select").selectize({
        onInitialize: function() {
             this.$control_input.attr('readonly', true);
        }
});

Answer 5

只要一点点 CSS 和一点点 JS，我们就可以创建这个。而且看起来很完美。

var select = $("#my-select-input");
$(select).next().find("div.selectize-input").addClass("no-searchable"); // Adding style to the div
$(select).next().find("div.selectize-input > input").addClass("no-searchable"); // Adding style to the input
$(select).next().find("div.selectize-input > input").prop("readonly", true); // Setting the input to read-only
$(select).next().find("div.selectize-input > input").prop("inputmode", "none"); // Guarantee in case it opens on the cell phone and click on the input no keyboard is opened
$(select).next().find("div.selectize-input > input").focus(function () { // Hack for when the search input gets the focus it will automatically blur.
    $(this).blur();
});

.no-searchable {
    cursor: pointer !important;
    background-color: #FFFFFF !important;
}
.has-items input.no-searchable {
    width: 1px !important;
}

如何禁用 selectize.js 中的自动过滤？内置/插件/修改源？

How can I disable automatic filtering in selectize.js? Built-in / plugin / modilfy source?

javascript

selectize.js