Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

select2 - get current search text

I'm using select2 and fetching available options from the server with this query function

var recipientsTimeout;
this.loadRecipients = function (query) {
    clearTimeout(recipientsTimeout);
    recipientsTimeout = setTimeout(function(){
        data.transmitRequest('lookupcontacts', { search: query.term }, function(resp){
            query.callback({ results: resp.items });
        });
    }, 500);
};

It uses our own ajax layer, and delays searching until the user stops typing, and it works fine. The only small issue is that if the user types some text, then immediately backspaces over it, my last timeout will still fire, and an ajax request will be fired, and ignored. This doesn't cause any problems, but it's less than optimal.

Is there any (preferably non-brittle) way to fetch whatever the current text is? It seems as though the query object sent in has an element property, which is a jQuery wrapper of the original hidden input I set select2 up with, but there's no direct way I can see to get the actual textbox that the user is typing in. Obviously I could inspect it and easily figure out the dom pattern and build up a selector from the hidden element back to what the user is typing in, but I really hate doing that, since the specific layout could easily change in a future version.

So what is the best way to get the currently entered text, so I could do a quick check on it when the setTimeout expires, and I'm about to run my ajax request.

like image 785
Adam Rackis Avatar asked Jan 13 '14 17:01

Adam Rackis


1 Answers

I'm using 4.0.3 and the way I did it is this:

$("#mySelect2").data("select2").dropdown.$search.val()
like image 102
Javier Avatar answered Oct 15 '22 10:10

Javier