Ionic 2 - IOS 10 Keyboard bug

[John0x]

Short description of the problem:

This happens on every ios 10 device.
If you open a dialog (alert) und enter something into an input field and you close the dialog (by clicking the close button), then the keyboard will stay open and not close.
I've tried to use the ionic keyboard plugin to close the keyboard manually upon clicking the button (Keyboard.close()), but it has zero affect.

I've created a new blank project (ionic start testProj --v2 --ts) and added a dialog with an input field and a button (actually took the code from the docs to make sure), it has the same effect.

Other information: (e.g. stacktraces, related issues, suggestions how to fix, stackoverflow links, forum links, etc)
There are no error messages or whatsoever.

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

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

Cordova CLI: 6.3.1
Gulp version: CLI version 3.9.1
Gulp local: Local version 3.9.1
Ionic Framework Version: 2.0.0-beta.11
Ionic CLI Version: 2.0.0-beta.37
Ionic App Lib Version: 2.0.0-beta.20
OS:
Node Version: v6.3.0

[John0x]

It feels like there is something blocking, since the log output and a lot of events are having a weird behavior on ios.

[John0x]

Any news about this?
Got a release on hold because of this bug.

[jgw96]

@John0x would you mind trying this with our wkwebview plugin. Thanks!

[John0x]

Sadly it does not fix the bug.
Have you tried recreating the bug as described in the first post?

[John0x]

I installed the plugin properly and it was running (confirmed), but still had the same behaviour.

[zefrench]

Same problem here, the keyboard does not close and it's a big problem for iOS apps...

[jkobylec]

This happens in Ionic 2 RC0 as well; fixing this soon would greatly improve the confidence of those of us who are considering Ionic for a new app but want assurance that it will stay on top of device platform updates.

[zefrench]

For me it's a pain to update my ionic2 beta 11 app version to RC0..

[jkobylec]

Yes, publishing a workaround that works prior to RC0 would also be super nice since the update isn't trivial.

[zefrench]

I start to update today but as I'm not sure if there will be some big change log soon, I think it's better to wait and update my app when Ionic team will ensure there will not be any other BIGGGGG Change....

[John0x]

It's the RC, so there shouldn't be alot of big changes anymore.
The Keyboard doesn't close automatically but you can close it yourself by subscribing to the onWillDismiss event and then close it manually (Keyboard.close() with the Keyboard plugin).

[zefrench]

Thanks @John0x this is a good fix.
Someone here notice there is a strange behavior when you launch an alert ?
The view (only the content not the header) is turning white for some millisecond and then the alert is shown.

[richardshergold]

I'm seeing this problem too - the keyboard is not disappearing after an alert. IOS 10 (iPhone SE) running from within Ionic View.

[sjdrew]

Definitely a bug. I was also able to get rid of the keyboard by using onDidDismiss() and Keyboard.close() on the alert controller, but still looks unprofessional as the screen scrolls up including the header. Hope it gets fixed soon.

[GrischaSchmiedl]

Is there an update to this bug? With RC.1 and iOS10 I still see the bug.

[ghenry22]

Yep I also see this one with rc1.

[jvlobo]

It also happens to me on RC1, and not in an alert. Just on a regular input on a regular form, if you send the form by tapping on return key, after the redirect with this.nav.setRoot the keyboard keeps open.

[manucorporat]

Working in this issue! Sorry for taking so long

[rodrigobnn]

I made a workaround importing Keyboard from 'ionic-native' anda executing 'Keyboard.close()' after the action I needed

[ahlidap]

Hi,

Importing the Keyboard and force it to close partially worked for me, as the input dialog sometimes stays open and freezes the app.

will this be fixed in the next version? Any hind on a release date for it?

Thanks for your effort.
Cheers

[DianeBustamante]

I am also experiencing this issue with an Ionic 1 project. The keyboard was working fine until I updated my iPhone to iOS 10.1.1.

Will the fix be applied to both Ionic 1 and 2?

Thanks

[numerized]

Same here on Ionic2rc3 I'm using Ionic-native and Keyboard.close() meanwhile.

[adamdbradley]

Thanks for the report everyone, we're working on this right now and I'll keep everyone updated, thanks

[adamdbradley]

I've made some updates to how alerts work when there's a text input, and it's on a mobile device. Would this group be able to test out our nightly version and let me know how it goes? Thanks

[ohh2ahh]

The keyboard is working great on iOS 10.1.1. Although the alert isn't vertically centered anymore and it doesn't get "pushed up" by the appearing keyboard. Is that intended?

[wwallace]

@ohh2ahh It seems that it is intended to solve the keyboard overlap issue, per the commit:
// this alert has a text input and it's on a mobile device so we should align
// the alert up high because we need to leave space for the virtual keboard
// this also helps prevent the layout getting all messed up from
// the browser trying to scroll the input into a safe area

[Daphko]

How can i implemented the changes from @adamdbradley ? I still have the alert input keyboard issue and no idea how to solve this or make a workaround.

[numerized]

@Daphko you can install ionic native keyboard plugin and use it like this

import { Keyboard } from 'ionic-native';

[...]


createTodo(){
    var id = new Date();
    let prompt = this.alertCtrl.create({
      title: this.translate.instant("todo.addTodo"),
      message: this.translate.instant("todo.addTodoMessage"),
      inputs: [
        {
          name: 'title'
        }
      ],
      buttons: [
        {
          text: this.translate.instant("ui.cancel"),
          handler: () => Keyboard.close()
        },
        {
          text: this.translate.instant("ui.save"),
          handler: data => {
            this.todoService.createTodo({
              _id:'todo:'+id.getTime(),
              title: data.title,
              type:'todo',
              created_at : new Date().toISOString()
            });
          }
        }
      ]
    });
 
    prompt.present();
 
  }

[Daphko]

Thx @numerized but the solution has one problem. If you click outside the alert box, the alert box closes and the keyboard stays open. Thats because there is no handler for this click action. Do you have any solution for this?

[dominikstrasser]

I think onDidDismiss and onWillDismiss are called.

prompt.onDidDismiss(()=> {
   Keyboard.close()
})

[arturalkaim]

Hi!
I'm having this issue with the ion-searchbar.
The keyboard just don't go away.

No answer for this.keyboard.close(); and console.log("keyboard open:", this.keyboard.isOpen()); always prints true.

Any info that could fix this?

Your system information:
Cordova CLI: 6.4.0 
Ionic Framework Version: 2.0.0-rc.6
Ionic CLI Version: 2.2.1
Ionic App Lib Version: 2.2.0
Ionic App Scripts Version: 1.0.1
ios-deploy version: 1.9.0 
ios-sim version: Not installed
OS: macOS Sierra
Node Version: v6.9.1
Xcode version: Xcode 8.2.1 Build version 8C1002

[peterpeterparker]

@arturalkaim try Keyboard.close(); instead of this.keyboard.close();

import {Keyboard} from 'ionic-native';
...
    Keyboard.close();

[arturalkaim]

Thanks @peterpeterparker!
It should close on blur but this worked as a workaround...

[jayaj12]

I have issues with ionic 1.3.2 and iOS 10.1.1. When keyboard pop up the page scroll up with lot of space in between the keyboard and input field. This was working fine in iOS 9.1.1.

[ghost]

When I use Keyboard.close(); the keyboard closes but whenever I touch the screen it reopens. Any ideas anyone?

[mino922]

@RobVR I am also having this issue. Did you ever find a fix? I am using iOS 11.

[ionitron-bot]

Thanks for the issue! This issue is being locked to prevent comments that are not relevant to the original issue. If this is still an issue with the latest version of Ionic, please create a new issue and ensure the template is fully filled out.