ionic-framework: bug(input): input controls in sliders are broken

Ionic version: (check one with “x”) [x] 2.x

I’m submitting a … (check one with “x”) [x] bug report

Current behavior: I have an ion-slides component which has some ion-input and ion-textarea controls in. On RC2 the way the form scrolled when a keyboard displayed on a device was bearable. In RC3 it is completely broken. In latest nightly it’s better but still very bad.

When a user touches an input, the input completely flies off the screen or is in the completely wrong position. When the keyboard is dismissed the screen is not returned to it’s proper position. I have ion-footer elements in each ion-slide which show how the screen is not aligned after the keyboard is dismissed.

On iOS the footer and input are in the wrong positions, and sometimes the inputs do not even accept inputs from the keyboard.

Tested on Android 6.0.1 and iOS 10.1. No Crosswalk or WKWebView.

Expected behavior: Scrolling to work correctly for form inputs on slides.

Similar to this issue. https://github.com/driftyco/ionic/issues/5744

See Android screenshots below. I will send a repro project to whichever team member requires it.

screenshot_20161208-160805 screenshot_20161208-160809 screenshot_20161208-160818

Ionic info: (run ionic info from a terminal/cmd prompt and paste output below):

Cordova CLI: 6.4.0
Ionic Framework Version: 2.0.0-rc.3-201612080433
Ionic CLI Version: 2.1.12
Ionic App Lib Version: 2.1.7
Ionic App Scripts Version: 0.0.46
ios-deploy version: 1.9.0
ios-sim version: 5.0.10
OS: macOS Sierra
Node Version: v6.9.1
Xcode version: Xcode 8.1 Build version 8B62

About this issue

  • Original URL
  • State: closed
  • Created 8 years ago
  • Reactions: 5
  • Comments: 21 (7 by maintainers)

Most upvoted comments

Hey @jgw96 how did the cleanup go?

I noticed your inputSlides link you listed is gone now.

Also having this issue with ionic@latest

Removing the 300px padding helps in latest nightly. However on iPhone 5 things are horrible still.

    //fix for ionic scroll not playing nice with slides
    .scroll-content {
        padding-bottom: 0px!important;
    }

image

still an issue with the input disappearing upon attempting to use keyboard. tested on my Android 5.1 MotoG too with same issue.

ionic info: screen shot 2017-05-04 at 18 00 10

This is still an issue in version 3.6.0. @jgw96 are you able to share your hack as a temporary solution?

cli packages: (D:\Projects\progressa\demo\node_modules)

@ionic/cli-plugin-cordova       : 1.6.1
@ionic/cli-plugin-ionic-angular : 1.4.1
@ionic/cli-utils                : 1.7.0
ionic (Ionic CLI)               : 3.7.0

global packages:

Cordova CLI : 7.0.1

local packages:

@ionic/app-scripts : 2.1.3
Cordova Platforms  : android 6.2.3
Ionic Framework    : ionic-angular 3.6.0

System:

Node : v8.2.1
OS   : Windows 10
npm  : 5.3.0

Android and iOS still the same problem with newest wkwebview and Ionic 3.0.1

Link is dead …