我在我的应用中使用Select2来搜索包含大约1200个选项的下拉列表。
我目前正在使用Select2匹配器的默认实现,只要关键字在搜索结果中相邻,它就能正常工作:
function(term, text) { return text.toUpperCase().indexOf(term.toUpperCase())>=0; }
例如,搜索“stackoverflow问题”会返回选项'Stackoverflow关于Select2的问题'
我会更喜欢匹配器根据非相邻关键字返回结果。例如,我还希望它在搜索'stackoverflow select2'时返回上面的选项。
是否有人知道如何创建自定义匹配器以允许此行为?
答案 0 :(得分:9)
这就是我在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;
}
我知道这是一个老话题,但也许有人觉得这很有用。
答案 1 :(得分: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
答案 2 :(得分:1)
试试这个:
搜索 Stackoverflow问题, stackoverflow select2 , select2 stackoverflow ,关于stackoverflow select2问题,问题select2 about
<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;
}
});
答案 3 :(得分:0)
查找全部或部分命令词:
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;
}
});