.focus() within iOS mobile is not opening keyboard

Hi All,

I have Mobile app containing a credit card details page. For this particular field there are 4 text boxes. Upon entering details within one text box my focus should shift automatically to the next input box. 

I am currently using "$("#ATMCardNumber").focus();" which seems to be working on Android devices however for the iOS devices the keyboard does not automatically open after the change of focus.

Solution

Hi Jitul,


In order to be able to use javascript to focus an input in IOS, you need to add an extra configuration on your application in the Extensibility configuration.

You can learn more about it on the following link:

https://success.outsystems.com/Documentation/11/Delivering_Mobile_Apps/Customize_Your_Mobile_App/Set_the_Preferences_for_Your_Mobile_App


As for the configuration needed, it should be the "KeyboardDisplayRequiresUserAction" = "False".


https://cordova.apache.org/docs/en/latest/config_ref/

Your config could look like the following:



image.png


After adding it and generating a new native build ( whenever you change the Extensibility configuration you will need to generate a new native build) you should be able to start using focus with javascript.

Just a quick remark, looking at the javascript code you are using, it seems you are still relying on Jquery. Although you can still use that, it will require you to import the full Jquery library to your application. If all you are doing is using it to get the DOM elements, consider using plain javascript for that.

For this particular example, you could replace your JS code with

document.getElementById("ATMCardNumber").focus();

Hope this helps,

Solution

Hi ,

This one works well.

document.body.ontouchend = function() { document.querySelector('#ATMCardNumber').focus(); };


Sravan

Thanks all for the help