CODEWITHSUNDEEP
androidhtmlangularcordova
iBug
iBug

Reputation: 2352

Enter event doesn't trigger the function on Android device using angular

There are multiple questions with answers related to my problem but unfortunately, none worked for me.

I have to detect the enter pressed on android keyboard and change focus from current matInput to next matInput.

I have tried keyup.enter, keydown and keypress but none worked for me. I implemented directive approach but doesn't trigger method when I am debugging app on Android device. Although, it does trigger the method on browser.

Here is what I am using.

HTML:

    <mat-form-field class="ib-input-container-width">
  <input matInput data-dependency="lastName" (keypress)="onChange($event.keyCode)" (keyup.enter)="handleNext('lastName')"  [formControl]="form.get('FirstName')" type="text" >

</mat-form-field>

<mat-form-field class="ib-input-container-width" >
  <input #lastName id="lastName" matInput  [formControl]="form.get('LastName')" type="text">

TS: 

  handleNext(elementId){
    let nextElement = document.getElementById(elementId);
    console.log(nextElement);
    nextElement.focus();
  }

  onChange(event){
    console.log(event.keycode);
  }

PS: I am on a working progressive web app using Cordova.

Update

I have tried solution from https://stackoverflow.com/a/28103608/3081929 But ng-change doesn't work either.

Upvotes: 7

Views: 2143

Answers (1)

Nauman
Nauman

Reputation: 86

the code looks correct,

before running your codova app on android make sure you have compiled the angular project using angular cli and output should be set to www folder

Upvotes: 2

Related Questions