非相邻关键字的 Select2 自定义匹配器答案

【问题标题】：Select2 Custom Matcher for Non-Adjacent Keywords非相邻关键字的 Select2 自定义匹配器
【发布时间】：2014-07-27 11:21:10
【问题描述】：

我在我的应用程序中使用Select2 以允许搜索包含大约 1200 个选项的下拉列表。

我目前正在使用 Select2 匹配器的默认实现，只要关键字在搜索结果中相邻，它就可以正常工作：

function(term, text) { return text.toUpperCase().indexOf(term.toUpperCase())>=0; }

例如，搜索“stackoverflow question”会返回选项“关于 Select2 的 Stackoverflow question”

但是，我希望匹配器根据不相邻的关键字返回结果。例如，我还希望它在搜索“stackoverflow select2”时返回上述选项。

有人知道如何创建自定义匹配器来允许这种行为吗？

【问题讨论】：

请注意标签不是关键字。在标签列表中塞满与您的问题相同的词（搜索、关键字、映射器）将无助于对其进行分类。请务必阅读选择标签时出现的说明！
感谢查尔斯的通知，将在以后的帖子中这样做！

标签： javascript jquery-select2

【解决方案1】：

这就是我在 Select2 4 中所做的。我希望 matcher 只返回包含输入的所有关键字的选项（假设关键字是由“”分割的搜索词）。匹配不区分大小写。

        matcher: function (params, data) {
                // If there are no search terms, return all of the data
                if ($.trim(params.term) === '') {
                    return data;
                }
                // `params.term` should be the term that is used for searching
                // split by " " to get keywords
                keywords=(params.term).split(" ");
                // `data.text` is the text that is displayed for the data object
                // check if data.text contains all of keywords, if some is missing, return null
                for (var i = 0; i < keywords.length; i++) {

                    if (((data.text).toUpperCase()).indexOf((keywords[i]).toUpperCase()) == -1) 
                      // Return `null` if the term should not be displayed
                      return null;

                }
                // If here, data.text contains all keywords, so return it.
                return data;
            }

我知道这是个老话题，但也许有人觉得这很有用。

【讨论】：

【解决方案2】：

如果您有大量数据或嵌套数据，则排列将花费大量时间。

尝试使用非相邻关键字进行搜索。

在初始化select2之前把这个函数放在你的document.ready中。

$(function () { 

    var keywords;

    $.fn.select2.defaults = $.extend($.fn.select2.defaults, {            
        placeholder: 'Select...',            
        matcher: function(term, text, option) {

            if ($.trim(term) === '') {
                return true;
            }             
            keywords = (term).split(" ");

            for (var i = 0; i < keywords.length; i++) {

                if ((text.toUpperCase()).indexOf((keywords[i]).toUpperCase()) == -1 )                        
                {                        
                    return false;
                }                                         
            }                
            return true;  
        }
    });

  $("#DropdownID").select2();

});

工作示例在这里：http://makmilan.blogspot.in/2015/11/select2-custom-matcher-for-non-adjacent.html

【讨论】：

【解决方案3】：

试试这个：

搜索 Stackoverflow 问题、stackoverflow select2、select2 stackoverflow、关于 stackoverflow select2 问题、question select2 关于

<select id="e17_2" style="width:300px">
   <option alt="Stackoverflow question about Select2">Stackoverflow question about Select2</option>
   <option alt="Stackoverflow Other line ...">Stackoverflow Other line ...</option>
</select>

复制自：https://stackoverflow.com/a/21745151/3710490

function permute(input, permArr, usedChars) {
    var i, ch;
    for (i = 0; i < input.length; i++) {
        ch = input.splice(i, 1)[0];
        usedChars.push(ch);
        if (input.length == 0) {
            permArr.push(usedChars.slice());
        }
        permute(input, permArr, usedChars);
        input.splice(i, 0, ch);
        usedChars.pop();
    }
    return permArr
};


$("#e17_2").select2({
    matcher: function(term, text) { 

                if (term.length == 0) return true;
                texts = text.split(" ");

                allCombinations = permute(texts, [], []);

                for(i in allCombinations){
                    if( allCombinations[i].join(" ").toUpperCase().indexOf(term.toUpperCase())==0 ){
                        return true;
                    }
                }

                return false;

    }
});

【讨论】：

谢谢！当关键字的顺序与它们在选项中出现的顺序相同时，这就像一个魅力。例如，在搜索“stackoverflow select2”时，这确实会返回“关于 Select2 的 Stackoverflow 问题”。但是，在搜索“select2 stackoverflow”时它不会返回这个。您是否也知道如何做到这一点？
@AV86NL 你真正想要的不是我实现的。您的搜索应该始终从左到右开始，而不是相反。要查找 关于 Select2 的 Stackoverflow 问题，您可以搜索：Stackoverflow question、question about、question Select2，但永远不会从右到左（select2 about，about Stackoverflow）。为此，您必须更改选项单词的顺序（从 关于 Select2 的 Stackoverflow 问题 到 关于问题 Stackoverflow 的 Select2），然后再次搜索......你明白了吗我的观点？
感谢您的解释。不幸的是，我无法更改选项内容的顺序，因为所有选项都是固定的产品描述。我试图让最终用户在这些描述中搜索术语（无论它们在描述中的位置），并且只返回那些所有术语都包含在产品描述中的选项。 Select2 是否有可能，或者我应该寻找其他解决方案？自从您完全回答了我最初的问题以来，我已将您的答案标记为已接受。谢谢！
你不需要改变你的选项，只定义匹配器。您的具体要求是什么？只需列出它们以丢弃/批准
反向搜索现在效果很好，谢谢。唯一的额外要求是允许搜索任意数量的关键字。当前要搜索的关键字数量似乎仅限于两个:-)

【解决方案4】：

查找全部或部分祈使词：

element.select2({
    matcher: function(term, text){
        if (term.length < 3) { return true }
        var terms = term.split(" ");
        var count = 0;
        var nbterm = terms.length;

        for(i in terms) {
            if (text.toUpperCase().match(new RegExp(terms[i], "i"))) { count++ }
                if(nbterm == count){
                    return true;
                }
             }
             return false;
         }
});

【讨论】：