Scroll to the focused item input when the keyboard is up


#21

@rajeshwarpatlolla thanks! This worked for me.


#22

Disabling native scrolling worked for me :smile:


#23

Can we on and off the scrolling based on page to page.
for example i have main page where i want native scrolling and i have add page where i want js scrolling can we do that if so please tell how? @bengtler @adam @Calendee


#24

I have to disabled overflow-scroll=true in ion-content as @rajeshwarpatlolla said, but also changed scroll to true: scroll="true".

Now it’s work for me.


#25

I was experiencing a similar issue. jumpy scroll and when you focus on some input while the keyboard is up, the scroll will be erratic and pushes the target input out of the viewport (under header bar).

Just disableScroll didn’t help. It did fix the jumpy scroll but I was still having issues with erratic scrolling on long forms when you tap on input while the keyboard is up.

To fix this, I additionally had to do

.config(function($ionicConfigProvider){
  $ionicConfigProvider.scrolling.jsScrolling(false);
})

Not sure why this was required after disabling scroll.
Hope this helps.


#26

I still have this issue with ionic 1.2.1.

Did someone find the solution ?

My content tag is:

<ion-content scroll="true" class="has-subheader" padding="true">

Thanks


#27

How did you fix it. Can you elaborate please. Thanks


#28

Iam unable to use two scrollers in single form using ionic.can you provide how to use multi scrollers


#29

Hi Tim,

Is there any update on this issue ?


#30

use overflow-scroll = true on your ion-content…for universally disabling js scrolling add
ionicConfigProvider.scrolling.jsScrolling(false);
in your config file and please make sure you are using keyboard plugin in your app


#31

thanks for the update @harshit886, Ya We are doing the same in our app Issue still exists.

It is working fine in landscape and portrait when open directly, But when we rotate the screen from portrait to landscape with the keypad open we are facing the issue.


#32

hey i have checked on android and windows phone. It is working fine will check on ipad also. Sharing the screenshots


#33

@harshit886 yes, it is working fine in windows and android but we are facing issue in IPAD, Please follow the step below and check once in IPAD

  1. open the keypad in portrait and rotate the device to landscape with the keypad enabled

#34

yeah there is problem on ipad…


#35

I added

.config(function($ionicConfigProvider){
  $ionicConfigProvider.scrolling.jsScrolling(false);
})

And

<ion-content overflow-scroll="true" scroll="true" class="has-header">

And the problem was solved, but another problem appears, some parts of the form disappears :

Any idea?


#36

I think ,but not tested, you would have to resort to a combination of old Javascript like key.on, + a class on the input on ionic-input or so. Another possible solution is using native Angular input and forms values like .dirty state, it works perfectly in Ionic.

https://docs.angularjs.org/api/ng/type/form.FormController


#37

Hi FrancoisIonic,

Thanks for the anwser, but can you show a sample code with your Idea? I did
not understand How to do this. I am using the directive form and HTML tag
input, How can I use Native angular input and forms value to fix this
problem?


#38

Do you use Ionic V2? (not just an idea, it’s coded)

ok on the HTML validation

        <form [formGroup]="accountForm" (ngSubmit)="updateAccount()">
          <ion-item>
            <ion-label floating>Prénom</ion-label>
            <ion-input type="text" [(ngModel)]="myAccountObjectValues.accountFirstName" formControlName="accountFirstName" required></ion-input>
          </ion-item>
          <ion-item *ngIf="!accountForm.controls.accountFirstName.valid && (accountForm.controls.accountFirstName.dirty || submitAttempt)">
              <p>Merci d'entrer un prénom de 3 lettres au moins, par exemple Luc, sans chiffres.</p>
          </ion-item>

Using FormGroups and Validators on the .Ts file, it uses french error messages, sorry i’m french and didn’t translate that part yet:)

This is kinda advanced form validation, because as long as the input is invalid, but only when someone type something, it will show the error message in async.

And this is definetely ionic V2++ guys, sorry I didn’t mean to troll your topic, I answered a question.


#39

I am using ionic v1. Is this solution Works with v1?


#40

In some inputs on the form the scroll works and centralize the focus, but
in other inputs like this below not:

Diego Felix de Almeida
+556183798073