Description
We're building an application that needs to show suggestions only after a user has typed a certain character. I was able to use Selectize's microplugin support to override Selectize's onKeyUp function so only certain characters trigger the Selectize dropdown. But I'm running into a new issue now. Here's my override:
this.onKeyUp = (function(e) {
var $input = self.$control_input;
// Lib variables
var letterArray = [];
var regex = /@/i;
var cursorIndex = $input[0].selectionStart;
var inputValue = $input.val();
// Clear out currentWord if there is nothing in the input
if(!inputValue) {
self.currentWord = '';
}
if(letterArray.length !== inputValue.length) {
inputValue = $input.val();
letterArray = inputValue.split('');
}
for(var i = cursorIndex - 1; i >= 0; i--) {
if(letterArray[i] === ' ' || i === 0) {
var index = i === 0 ? 0 : 1;
self.currentWord = inputValue.slice(i).split(' ')[index];
break;
}
}
if (self.isLocked) return e && e.preventDefault();
if(regex.test(self.currentWord)) {
var value = self.currentWord.slice(1) || '';
if (self.lastValue !== value) {
self.lastValue = value;
self.onSearchChange(value);
self.refreshOptions();
self.trigger('type', value);
}
}
});
So what I'm able to do is tell Selectize to use only the word after the character to hit the remote source and search for values. This part works great. It hits our API and returns the results. But then I realized that Selectize has its own search functionality using Sifter that finds matches based on the text in the input and the results from the remote source. That's when my solution starts to break down. I only want Sifter to use the text after the special character to do its filtering just like I only want that text to be used when hitting our search endpoint. I'm pretty sure these two lines in the source are the culprit (line #1419 & #1420):
var query = self.$control_input.val();
var results = self.search(query);
What I'd really like to be able to do is pass in a custom text value rather than the entire input contents like .val() is getting. I could override refreshOptions but that seems like a hack at best...and it's bound to cause problems later when trying to update to the latest version of Selectize. So I'm wondering, should I override, or could I submit a pull request to allow for a custom query function which returns a string which will then be passed to self.search()?