Say for example. If there is one option as "Eyes Nose", then I want to search the option with input as "Ey No". Select2 fails to suggest the option here.
By default if we just search with input as "Ey" or "No", then the option will be displayed, but whenever the letter sequence is not followed while searching (like if I input with a space like this "Ey ") then the select2 search suggestion does not work.
I have known that by modifying matcher() function of select2, this can be done. I am not being able to do it.
For example: I have simple select with options:
<select>
<option id="1">Mouth</option>
<option id="2">Head</option>
<option id="3">Eyes Nose</option>
</select>
I want to search here with keyword "Ey No" and it should display option with id=3 that is "Eyes Nose".
I found one solution working.
matcher: function(params, data) {
// If there are no search terms, return all of the data
if ($.trim(params.term) === '') {
return data;
}
// Do not display the item if there is no 'text' property
if (typeof data.text === 'undefined') {
return null;
}
var words = params.term.toUpperCase().split(" ");
for (var i = 0; i < words.length; i++) {
if (data.text.toUpperCase().indexOf(words[i]) < 0) {
return null;
}
}
return data;
}
The problem was with the version. The matcher parameters has changed and the above code works with select2 latest version now. This solution helps search select option with parts of words in the search bar.