Skip to content

Ionic2 long input form jumps to top on scroll down #5830

Closed
@Yagger

Description

@Yagger

Short description of the problem:

On the mobile device only (not emulator or browser), if the list of input fields in long enough (so that you need to scroll it when keyboard is open), and the cursor in on one of the top fields, then scrolling down will cause the page to scroll back up and the cursor does some mysterious blinking through the fields.

What behavior are you expecting?

When scrolling down the list of input fields and given the cursor is somewhere on top, page should not scroll back to the field with cursor.

Steps to reproduce:

  1. Start the basic ionic2 app
$ npm install -g ionic@beta
$ ionic start BlankStarter blank --v2
$ cd BlankStarter
$ ionic serve
  1. Edit /path/to/BlankStarter/app/pages/home/home.html so that <ion-content> will contain the long list of <ion-item> with input.
  2. Upload the app to ionic view
  3. On your iPhone (6 plus in my case) open the app
  4. put the cursor in the first input field
  5. scroll down and note how cursor blinks though the fields and the the page jumps back to the field with set cursor. Very annoying and hard to manage.
<ion-navbar *navbar>
  <ion-title>
    Home
  </ion-title>
</ion-navbar>

<ion-content class="home">
  <ion-list>
    <ion-item>
      <ion-label fixed>Username</ion-label>
      <ion-input type="text" value=""></ion-input>
    </ion-item>
    ........copy/paste  <ion-item> 20 times or more..........
  </ion-list>
</ion-content>

Other information: (e.g. stacktraces, related issues, suggestions how to fix, stackoverflow links, forum links, etc)

Which Ionic Version? 1.x or 2.x
2.x

Run ionic info from terminal/cmd prompt: (paste output below)
Your system information:

Cordova CLI: 6.0.0
Gulp version: CLI version 3.9.0
Gulp local: Local version 3.9.1
Ionic Version: 2.0.0-beta.3
Ionic CLI Version: 2.0.0-beta.19
Ionic App Lib Version: 2.0.0-beta.9
ios-deploy version: 1.8.5
ios-sim version: 5.0.6
OS: Mac OS X El Capitan
Node Version: v5.3.0
Xcode version: Xcode 7.2.1 Build version 7C1002

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions