Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Textfield does not focus in UI WebView in iOS7

The textfield does not focus if it is located in the bottom half of the screen but it works if it is in the top half. I find this problem in iOS7 in the simulator as well as the device in an installed app. Iam using sencha touch & phonegap but I dont think they are the reason for the problem since even a simple textfield positioned below half the height of the screen fails.

When I tap on the textfield the OS should push the textfield a little above before the keyboard gets shown. But this does not happen instead only the keyboard is shown without any focus or pushing of the screen. How should I enable this in iOS7 so that I can fix the problem.

Thanks

like image 902
Ram G Athreya Avatar asked Dec 02 '22 21:12

Ram G Athreya


1 Answers

Finally found the reason for the problem. If you are using UIWebview then you should set the min-height of the body tag to the inner height of the device. For example 460px for iPhone 4S or 520px for iPhone 5

Inner Height = Device height - Status bar height = 460px which should basically be the height of the app container. I put this piece of code in my phone gap device ready function & everything worked like a charm

document.addEventListener("deviceready", function(){
    var body = document.getElementsByTagName('body')[0];
    body.style.minHeight=window.innerHeight + 'px';
}, false);
like image 68
Ram G Athreya Avatar answered Dec 27 '22 02:12

Ram G Athreya