Hi, @kareem~~
I was talking about bug #1. I was thinking about it some more last night, and I came up with a workaround for it in my own application, but it relies on specifying the transport function (which my code was already using). I added this code at the beginning of my transport function:
var curSearchText = $('input.select2-search__field').val();
if (curSearchText !== params.data.term) {
return;
}
// Actual AJAX query logic goes here.
I had to adjust the delay parameter to 500 so it would work if the user just holds down the Backspace key (because there’s a delay before the keyboard’s auto-repeat kicks in), but this works for my application.
If you’re not using a custom transport function, I think you could accomplish a similar effect with a custom ajax.processResults function: in that function you would check whether the current value in the input field (i.e., $('input.select2-search__field').val().length) is less than the minimum input length. If it is, you return an empty array; otherwise you do whatever processing you’d normally do (or the minimal processing required) to return the results. You’ll still take the hit for the “unwanted” AJAX call, but at least the user won’t see the results from it. (I’ve confirmed this works in the JSBin.)
This solution still has the #2 bug (I can see the “unwanted” tag being created), but similar logic in the createTag function fixes that (also confirmed in the JSBin):
createTag: function (params) {
var term = $.trim(params.term);
if (term === '' || $('input.select2-search__field').val().length < 2) {
return null;
}
return {
id: term,
text: term,
newTag: true
}
},
Let me know if you make progress with this issue.
~~John
)