This is a migrated thread and some comments may be shown as answers.

Can't trigger .blur() after selecting an item

1 Answer 171 Views
This is a migrated thread and some comments may be shown as answers.
Top achievements
Rank 1
Artie asked on 21 Jul 2015, 09:05 PM

We are trying to call .blur() on an auto complete after the user has selected an item.  The main reason for this is that when the textbox has focus, the keyboard on the iPad remains up.  We were given a requirement that we hide the keyboard after the user selects an item, something we figured we could accomplish by simply invoking .blur() on the input field.  What we are finding though is that something in the framework immediately re-calls focus() on the input right after we call blur().  I've tried many different little hacks to override, cancel, or prevent the various events but I've had no luck.  I've created a Dojo that demonstrates this behavior:

If you look at the console, you can see the order in which events are firing:

blur  <-- I called this one programatically
focus <-- I did not call this one!

Any ideas as to how we can get the iOS keyboard to go away after an item has been selected?


1 Answer, 1 is accepted

Sort by
Plamen Lazarov
Telerik team
answered on 23 Jul 2015, 02:24 PM

Hello Artie,

Thank you for the detailed information. Indeed you are right - .blur() will hide the keyboard. What you should do is to set timeout in the change/close event. E.g: 

change: function(e) {
  var ac = this;

For your convenience I modified the provided dojo in order to illustrate this approach.  

Plamen Lazarov
Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
Asked by
Top achievements
Rank 1
Answers by
Plamen Lazarov
Telerik team
Share this question