I am using mat-menu to display a form and need to change focus between inputs on the tab keypress event. But when I press tab, the mat-menu closes.
Example:
https://stackblitz.com/edit/angular-u5qbkt?file=src%2Fapp%2Fapp.module.ts
Asked
Active
Viewed 1,570 times
3
-
https://stackoverflow.com/questions/42240486/handle-tab-event – Saurabh Yadav Dec 12 '19 at 09:26
-
i have update your stackblitz - https://stackblitz.com/edit/angular-zwxjiw – Saurabh Yadav Dec 12 '19 at 09:27
-
@TheBallkar Please check this link. it help you https://stackblitz.com/edit/angular-hyfu7r?file=src/app/app.component.html – Abhishek Dec 12 '19 at 09:29
1 Answers
6
In form tag write this line (keydown.tab)="$event.stopPropagation()"
like this->
<form (keydown.tab)="$event.stopPropagation()" [formGroup]="form" (ngSubmit)="submit()" (click)="stop($event)" class="formValueGenerator" autocomplete="off">
Vijay Prajapati
- 738
- 1
- 7
- 20
-
Also you can add `(keydown.shift.tab)="$event.stopPropagation()"` for shift tab – Bastien Jun 07 '22 at 12:54