Skip to content
This repository has been archived by the owner on May 4, 2022. It is now read-only.

Soft keyboard Enter key event handling & remapping behavior #125

Open
ionitron-bot bot opened this issue Nov 28, 2018 · 0 comments
Open

Soft keyboard Enter key event handling & remapping behavior #125

ionitron-bot bot opened this issue Nov 28, 2018 · 0 comments
Labels

Comments

@ionitron-bot
Copy link

ionitron-bot bot commented Nov 28, 2018

Original issue by @softhorizons on 2016-08-20T17:24:44Z

Short description of the problem:

Really 2 inter-tangled issues:

  1. For SOFT (touch screen) keyboard ONLY, e.g. <input (keydown)="handler($event)"> keyboard-related events do not fire for Enter (keyCode 13) only. Other keystrokes fire ok.
  2. Enter-key handling on hardware (e.g. desktop browser) vs. soft keyboards is different: Enter on soft keyboard sends focus to next field (like a Tab key), whereas hardware kb does nothing.

What behavior are you expecting?

  1. Expect handler to fire on all keystrokes, regardless of kb type. This is regardless of issue (2).
  2. This one is trickier, more of a policy discussion. Soft keyboard has effectively remapped Enter --> Tab. This, however, leads to inconsistent behavior between platforms. Complicates testing & cross-platform, especially since beta11 release notes say you'll be targeting browsers soon. Seems to me there should be a documented option to map or not, or at least a documented way to trap and prevent the mapping. Regardless, key remapping should be put on the table & documented.

Steps to reproduce:
See code below.

  1. Place cursor in input field.
  2. Enter regular keystrokes. Note that console logs them correctly on all keyboards.
  3. Hit enter.
    3a. Soft keyboard: no logging of keystroke, sends focus to following button.
    3b. Hardware kb (desktop browser emulator): keystroke logged, no focus change
  <ion-list>
    <ion-item>
      <ion-input (keydown)="handler($event)"></ion-input>
    </ion-item>
    <ion-item>
      <button>Press me</button>
    </ion-item>
  </ion-list>
  handler(ev) { console.log(ev.keyCode) }

Which Ionic Version? 2.0 beta11

Plunker that shows an example of your issue

http://plnkr.co/edit/eYkvfr8lGIfmZlZwAzoY?p=preview

Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
Projects
None yet
Development

No branches or pull requests

0 participants