Android - keyboard is over the input (doesn't scroll to input)

Ionic Framework ionic-v3
1

In my application, I have an input list like so.

image
image.jpg542×548 30.1 KB

This is using an ion-grid with left column size 10 (x button) and an unspecified width column (should be 90) with an input, and an ion-note with item right (the picture icon)

There is content above that list, and below that list.

If I scroll up (I’m at the top of the page) and press on “Answer #3” (which is at the bottom of my view) this happens:

image

Answer #3 is hidden!

However, if I first scroll down to the bottom of the page, and then press on “Answer #4”, it shows fine, because it is at the top of my view:
image

I tried setting these inputs inside a form tag, which did not help.

I also found, that when I type a letter, it does scroll to the input, but just a click does not.

How do I add scroll to input on click? (so keyboard doesn’t hide it)

2

You should probably post (part of) your code, so someone with experience at the used components can look at it to see if you missed something.

3

Ok, here is some code:
Note: answers is of type Array<{text: string, file: FileInterface}>

<ion-grid text-center>
    <ion-row *ngFor="let answer of answers; let i = index;">
        <ion-col width-10>
            <button ion-button clear icon-only (click)="removeAnswer(i)">
                <ion-icon name="ios-close-circle-outline"></ion-icon>
            </button>
        </ion-col>
        <ion-col>
            <ion-item>
                <ion-label floating>Answer #{{i+1}}</ion-label>
                <ion-input type="text"
                           [(ngModel)]="answer.text"
                           autocorrect="on"
                           autocomplete="on"
                           spellcheck="true"
                           minlength="answer_min_length"
                           maxlength="answer_max_length">
                </ion-input>
                <ion-note item-right class="custom-note">
                    <app-file-upload [file]="answer.file"></app-file-upload>
                </ion-note>
            </ion-item>
        </ion-col>
    </ion-row>
</ion-grid>
4

Apparently, it is a bug with new Ionic:

5

I still have a similar problem, do you have any workaround? for example doing the view scrollable so I can see the last fields when keyboard is being shown?