Hi I have a input field that calls the funciton add_plu() when the tab key is pressed down. Although it works, it moves to the next element of the page (default action for a tab key).

How do I prevent the tab button from it's default behaviour? Here is my code:

   <input class="order-input-plu form-control" ng-model="order.orderwindow.add_field" ui-keydown="{ 'tab':'add_plu(order.orderwindow.add_field)'}">

Hi I have a input field that calls the funciton add_plu() when the tab key is pressed down. Although it works, it moves to the next element of the page (default action for a tab key).

How do I prevent the tab button from it's default behaviour? Here is my code:

   <input class="order-input-plu form-control" ng-model="order.orderwindow.add_field" ui-keydown="{ 'tab':'add_plu(order.orderwindow.add_field)'}">

• javascript
• jquery
• angularjs
• angular-ui
• angular-ui-bootstrap

1 Answer 1

The ui-key* directives provide the event in the scope, so you can add $event to the function call and do something with it.

ui-keydown="{ 'tab':'add_plu(order.orderwindow.add_field, $event)'}"

Then modify your add_plu to take the $event param, and call $event.preventDefault();