Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

How to blur Selectize.js input after selection has been made in Bootstrap 3?

I am using the Selectize.js. From the docs it says I can set up a 'onDropdownClose' callback here: Selectize docs. I can't seem to get it to work.

How do I blur (defocus) the input after a selection has been made using Selectize.js? All the blurs in the below code do not work.

$(document).ready(function() {
    $("#myinput").selectize({
    onDropdownClose : function ($dropdown) {
                       $($dropdown).prev().find('input').blur();
                      }
    });
});

EDIT: I am using Bootstrap 3.1.1. I just noticed that the default behavior for Bootstrap 2 is to blur the input after a selection has been made while Bootstrap 3+ leaves the input in focus after a selection has been made. My question still stands for Bootstrap 3+

Edit: I got it to work with the above code.

like image 378
fat fantasma Avatar asked Mar 06 '14 15:03

fat fantasma


2 Answers

Adding this just to have an actual answer. Your solution works.

$("#myinput").selectize({
  onDropdownClose: function(dropdown) {
    $(dropdown).prev().find('input').blur();
  });
});
like image 110
deadwards Avatar answered Nov 14 '22 23:11

deadwards


I had a similar issue and solved it using:

$('#myinput').selectize({
    onItemAdd: function () {
        this.blur();
    }
}
like image 39
naton Avatar answered Nov 14 '22 21:11

naton