1
0
mirror of synced 2024-11-28 23:56:03 +03:00

when using default formatResult the matching substring is now wrapped in span with class select2-match. fixes issue #137

This commit is contained in:
Igor Vaynberg 2012-06-19 21:31:56 -07:00
parent f9f3d6f4f3
commit 8f6513969e
2 changed files with 33 additions and 8 deletions

View File

@ -464,3 +464,5 @@ disabled look for already selected choices in the results dropdown
display: none;
}
/* end multiselect */
.select2-match { text-decoration: underline; }

View File

@ -223,6 +223,22 @@
return sizer.width();
}
function markMatch(text, term, markup) {
var match=text.toUpperCase().indexOf(term.toUpperCase()),
tl=term.length;
if (match<0) {
markup.push(text);
return;
}
markup.push(text.substring(0, match));
markup.push("<span class='select2-match'>");
markup.push(text.substring(match, match + tl));
markup.push("</span>");
markup.push(text.substring(match + tl, text.length));
}
/**
* Produces an ajax-based query function
*
@ -507,8 +523,8 @@
opts = $.extend({}, {
containerCss: {},
dropdownCss: {},
populateResults: function(container, results) {
var uidToData={}, populate, markup=[], uid, data, result, children;
populateResults: function(container, results, query) {
var uidToData={}, populate, markup=[], uid, data, result, children, formatted;
populate=function(results, depth) {
@ -531,7 +547,13 @@
uidToData[uid]=result;
}
markup.push("><div class='select2-result-label'>"+opts.formatResult(result)+"</div>");
markup.push("><div class='select2-result-label'>");
formatted=opts.formatResult(result, query, markup);
// for backwards compat with <3.0 versions
if (formatted!==undefined) {
markup.push(formatted);
}
markup.push("</div>");
if (compound) {
markup.push("<ul class='select2-result-sub'>");
@ -557,8 +579,8 @@
}
},
formatResult: function(result) {
return result.text;
formatResult: function(result, query, markup) {
markMatch(result.text, query.term, markup);
},
formatSelection: function (data) {
return data.fullText || data.text;
@ -824,7 +846,7 @@
matcher: this.opts.matcher,
callback: this.bind(function (data) {
self.opts.populateResults(results, data.results);
self.opts.populateResults(results, data.results, {term: term, page: page, context:context});
if (data.more===true) {
more.detach();
@ -897,7 +919,7 @@
}
results.empty();
self.opts.populateResults(results, data.results);
self.opts.populateResults(results, data.results, {term: search.val(), page: this.resultsPage, context:null});
postRender();
if (data.more === true) {
@ -1706,7 +1728,8 @@
local: local,
tags: tags
}, util: {
debounce: debounce
debounce: debounce,
markMatch: markMatch
}, "class": {
"abstract": AbstractSelect2,
"single": SingleSelect2,