iOS: No keyboard when selecting <input>"

Programming
,
1

I am facing an issue with the keyboard not showing up on Safari iOS when clicking on a particular field on my website. On other web and Android Chrome browsers, the keyboard appears as expected.

However, when I select the multitab button on Safari and return to the website, the keyboard will show up.

I have included the code snippet before and after clicking the text field. The onfocus event will trigger and remove the readonly property, yet the keyboard still doesn’t show up.

It seems to work flawlessly on Android, so I am wondering if something needs to be done to refresh the view so that the removal of the readonly property will take effect on iOS device (both Safari and Chrome).

2

This issue is a known bug in Safari on iOS. One solution is to add a delay before removing the readonly property to give the browser time to properly register the onfocus event. Another solution is to use autofocus instead of readonly to trigger the keyboard to appear.