0

I am using Onsen UI and Monaca to build a mobile app for iOS and Android. I would like to set focus on the #search-cities input field, once the #search-city page is visible.

I've tried:

$(document).on('pageinit', '#search-city', function() {
  console.log('pageinit: #search-city');
  // doesn't work!
  $('#search-cities').focus();
});

I am testing it on iOS and focus() doesn't set the search field on focus. Is there any way to do this with the onsen/monaca framework?

Boldizsar
  • 683
  • 2
  • 8
  • 17

2 Answers2

3

I know this question was asked few months ago, this is still posted in case someone still looking for solution.

In case you keep failing to autofocus input fields on iOS device.

Cause:

Cordova iOS Configuration KeyboardDisplayRequiresUserAction was set as true (default to true)

There is already an answer for this question.

Community
  • 1
  • 1
Trtshen Chaw
  • 353
  • 2
  • 10
1

The code you wrote should work fine. I made a element with id my-page that contains an input element with id my-input.

In the JavaScript:

$(document).on('pageinit', '#my-page', function() {
  $('#my-input').focus();
});

But this is exactly what you did so I don't understand why it isn't working in your case.

Working example: http://codepen.io/argelius/pen/jPXoNN

Andreas Argelius
  • 3,604
  • 1
  • 13
  • 22
  • It works fine in web, however it fails to focus on my iOS device. I would be happy to find some workaround on this issue. – Boldizsar Aug 04 '15 at 09:51