Keep the focus after selection

Question

I'm often using select2 in my applications and contrary to Blur Select2 input after close I'm looking for a way to keep the focus after selection.

As we can see in the official examples, blurring the input seems to be the default behavior after the selection (unlike the regular select).

This behavior is quite annoying when filling a form with the keyboard because tab won't go to the next input.

Is there a simple way to keep the focus in the input after selecting a value ?
A way that can be configured globally

Are you try `.on("select2-close", function() { var select2Data = $(this).data("select2"); select2Data.search.blur(); });`? — M. Wiśnicki, Feb 16 '17 at 14:45

score 2 · Answer 1 · answered Jun 12 '18 at 22:02

I ran into a similar problem with the select2 token/tag-inputs and was able to solve it by listening for the select2-close-event and then finding the search-input and give it the focus after a short delay/timeout.

.on('select2:close', function (e) {
    var select2SearchField = $(this).parent().find('.select2-search__field');
    var setfocus = setTimeout(function() {
        select2SearchField.focus();
    }, 100);
});

Keep the focus after selection

1 Answers1