ionic cordova app keeps pushing the screen up on input focus
up vote
1
down vote
favorite
my app keeps jumping up whenevever I try to fill any input.
This seems to happen in any input on my application, when the keyboard shows up, the screen is pushed up and the whole screen is moved up.
How to correct this?
I also noticed that inputs on the top of screen don't cause any harm
but if it's an input in the middle or below it causes the screen to go up
I already have, on my config.xml file the following:
<preference name="SplashScreen" value="screen" />
<preference name="KeyboardDisplayRequiresUserAction" value="false" />
<preference name="StatusBarStyle" value="#000000" />
<preference name="UIWebViewBounce" value="false" />
<preference name="KeyboardResize" value="false" />
<preference name="webviewbounce" value="false" />
<preference name="DisallowOverscroll" value="true" />
<preference name="Orientation" value="portrait" />
<preference name="fullscreen" value="false" />
<preference name="target-device" value="universal" />
<platform name="ios">
<preference name="KeyboardResize" value="false" />
<preference name="Orientation" value="portrait" />
<preference name="KeyboardDisplayRequiresUserAction" value="false" />
<platform name="android">
<preference name="KeyboardResize" value="false" />
<preference name="KeyboardDisplayRequiresUserAction" value="false" />
my inputs are for passwords and codes and look like this:
<div class="loginForm">
<input ng-disabled="authenticate" name="password" id="login_password" type="text" inputmode="numeric" placeholder="" required minlength="8" maxlength="8" ng-maxlength="8" autocomplete="off" autocorrect="off" autocapitalize="off" ng-model="login.Password" class="textInput" style="-webkit-text-security: disc; text-security: disc;">
the css for this input is only:
.loginBox .loginForm {width: 100%;display: flex;flex-direction: column;}
.textInput {font-size: 18px;}
.loginForm {position: relative;}
Also when debugging on browser, I can the values of this particular line are changing:
my ionic
<ion-content class="loginBg" scroll="true" padding="true" has-header="false" has-bouncing="false">
android cordova ionic-framework
add a comment |
up vote
1
down vote
favorite
my app keeps jumping up whenevever I try to fill any input.
This seems to happen in any input on my application, when the keyboard shows up, the screen is pushed up and the whole screen is moved up.
How to correct this?
I also noticed that inputs on the top of screen don't cause any harm
but if it's an input in the middle or below it causes the screen to go up
I already have, on my config.xml file the following:
<preference name="SplashScreen" value="screen" />
<preference name="KeyboardDisplayRequiresUserAction" value="false" />
<preference name="StatusBarStyle" value="#000000" />
<preference name="UIWebViewBounce" value="false" />
<preference name="KeyboardResize" value="false" />
<preference name="webviewbounce" value="false" />
<preference name="DisallowOverscroll" value="true" />
<preference name="Orientation" value="portrait" />
<preference name="fullscreen" value="false" />
<preference name="target-device" value="universal" />
<platform name="ios">
<preference name="KeyboardResize" value="false" />
<preference name="Orientation" value="portrait" />
<preference name="KeyboardDisplayRequiresUserAction" value="false" />
<platform name="android">
<preference name="KeyboardResize" value="false" />
<preference name="KeyboardDisplayRequiresUserAction" value="false" />
my inputs are for passwords and codes and look like this:
<div class="loginForm">
<input ng-disabled="authenticate" name="password" id="login_password" type="text" inputmode="numeric" placeholder="" required minlength="8" maxlength="8" ng-maxlength="8" autocomplete="off" autocorrect="off" autocapitalize="off" ng-model="login.Password" class="textInput" style="-webkit-text-security: disc; text-security: disc;">
the css for this input is only:
.loginBox .loginForm {width: 100%;display: flex;flex-direction: column;}
.textInput {font-size: 18px;}
.loginForm {position: relative;}
Also when debugging on browser, I can the values of this particular line are changing:
my ionic
<ion-content class="loginBg" scroll="true" padding="true" has-header="false" has-bouncing="false">
android cordova ionic-framework
add a comment |
up vote
1
down vote
favorite
up vote
1
down vote
favorite
my app keeps jumping up whenevever I try to fill any input.
This seems to happen in any input on my application, when the keyboard shows up, the screen is pushed up and the whole screen is moved up.
How to correct this?
I also noticed that inputs on the top of screen don't cause any harm
but if it's an input in the middle or below it causes the screen to go up
I already have, on my config.xml file the following:
<preference name="SplashScreen" value="screen" />
<preference name="KeyboardDisplayRequiresUserAction" value="false" />
<preference name="StatusBarStyle" value="#000000" />
<preference name="UIWebViewBounce" value="false" />
<preference name="KeyboardResize" value="false" />
<preference name="webviewbounce" value="false" />
<preference name="DisallowOverscroll" value="true" />
<preference name="Orientation" value="portrait" />
<preference name="fullscreen" value="false" />
<preference name="target-device" value="universal" />
<platform name="ios">
<preference name="KeyboardResize" value="false" />
<preference name="Orientation" value="portrait" />
<preference name="KeyboardDisplayRequiresUserAction" value="false" />
<platform name="android">
<preference name="KeyboardResize" value="false" />
<preference name="KeyboardDisplayRequiresUserAction" value="false" />
my inputs are for passwords and codes and look like this:
<div class="loginForm">
<input ng-disabled="authenticate" name="password" id="login_password" type="text" inputmode="numeric" placeholder="" required minlength="8" maxlength="8" ng-maxlength="8" autocomplete="off" autocorrect="off" autocapitalize="off" ng-model="login.Password" class="textInput" style="-webkit-text-security: disc; text-security: disc;">
the css for this input is only:
.loginBox .loginForm {width: 100%;display: flex;flex-direction: column;}
.textInput {font-size: 18px;}
.loginForm {position: relative;}
Also when debugging on browser, I can the values of this particular line are changing:
my ionic
<ion-content class="loginBg" scroll="true" padding="true" has-header="false" has-bouncing="false">
android cordova ionic-framework
my app keeps jumping up whenevever I try to fill any input.
This seems to happen in any input on my application, when the keyboard shows up, the screen is pushed up and the whole screen is moved up.
How to correct this?
I also noticed that inputs on the top of screen don't cause any harm
but if it's an input in the middle or below it causes the screen to go up
I already have, on my config.xml file the following:
<preference name="SplashScreen" value="screen" />
<preference name="KeyboardDisplayRequiresUserAction" value="false" />
<preference name="StatusBarStyle" value="#000000" />
<preference name="UIWebViewBounce" value="false" />
<preference name="KeyboardResize" value="false" />
<preference name="webviewbounce" value="false" />
<preference name="DisallowOverscroll" value="true" />
<preference name="Orientation" value="portrait" />
<preference name="fullscreen" value="false" />
<preference name="target-device" value="universal" />
<platform name="ios">
<preference name="KeyboardResize" value="false" />
<preference name="Orientation" value="portrait" />
<preference name="KeyboardDisplayRequiresUserAction" value="false" />
<platform name="android">
<preference name="KeyboardResize" value="false" />
<preference name="KeyboardDisplayRequiresUserAction" value="false" />
my inputs are for passwords and codes and look like this:
<div class="loginForm">
<input ng-disabled="authenticate" name="password" id="login_password" type="text" inputmode="numeric" placeholder="" required minlength="8" maxlength="8" ng-maxlength="8" autocomplete="off" autocorrect="off" autocapitalize="off" ng-model="login.Password" class="textInput" style="-webkit-text-security: disc; text-security: disc;">
the css for this input is only:
.loginBox .loginForm {width: 100%;display: flex;flex-direction: column;}
.textInput {font-size: 18px;}
.loginForm {position: relative;}
Also when debugging on browser, I can the values of this particular line are changing:
my ionic
<ion-content class="loginBg" scroll="true" padding="true" has-header="false" has-bouncing="false">
android cordova ionic-framework
android cordova ionic-framework
edited Nov 9 at 18:24
asked Nov 9 at 18:13
Ana Sequeira
77110
77110
add a comment |
add a comment |
active
oldest
votes
active
oldest
votes
active
oldest
votes
active
oldest
votes
active
oldest
votes
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53231263%2fionic-cordova-app-keeps-pushing-the-screen-up-on-input-focus%23new-answer', 'question_page');
}
);
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown