javascript - AngularJS - ng-keypress not working for enter event - Stack Overflow

In my project, ng-keypress is not working for Enter Key from all the places. From some places, it is wo

In my project, ng-keypress is not working for Enter Key from all the places. From some places, it is working perfectly fine but from other places, it is working for all the keys except Enter Key.

Here I'm calling a test() method on the ng-keypress.

<div class="actions">
    <div class="ui approve button red" data-ng-click="test()" id="confirm-yes" tabindex="8" ng-keypress="test()">Yes</div>
    <div class="ui cancel button" data-ng-click="test()" id="confirm-no" tabindex="7" ng-keypress="test()">Cancel</div>
</div>

From test method, I'm just showing the key code. I could see the keycode properly for all other key presses except Enter.

$scope.test = function () { 
            alert('test called'+event.keyCode);
        }

I have gone through many Stack Overflow articles and I'm sure its syntax is correct, but I'm totally confused about its strange behavior.

Any idea why ng-keypress is not working for entering and it is working for all other keys.

In my project, ng-keypress is not working for Enter Key from all the places. From some places, it is working perfectly fine but from other places, it is working for all the keys except Enter Key.

Here I'm calling a test() method on the ng-keypress.

<div class="actions">
    <div class="ui approve button red" data-ng-click="test()" id="confirm-yes" tabindex="8" ng-keypress="test()">Yes</div>
    <div class="ui cancel button" data-ng-click="test()" id="confirm-no" tabindex="7" ng-keypress="test()">Cancel</div>
</div>

From test method, I'm just showing the key code. I could see the keycode properly for all other key presses except Enter.

$scope.test = function () { 
            alert('test called'+event.keyCode);
        }

I have gone through many Stack Overflow articles and I'm sure its syntax is correct, but I'm totally confused about its strange behavior.

Any idea why ng-keypress is not working for entering and it is working for all other keys.

Share Improve this question edited Feb 20, 2021 at 22:57 Brian Tompsett - 汤莱恩 5,89372 gold badges61 silver badges133 bronze badges asked Nov 6, 2017 at 10:40 Rakesh BurbureRakesh Burbure 1,04512 silver badges27 bronze badges 7
  • It is not an event made for div you can try it on any input field like textarea or textbox. – Arpit Kumar Commented Nov 6, 2017 at 10:48
  • He added tabindex for that div. hope it will work for div also.@ArpitMeena – Vijay Krishna Commented Nov 6, 2017 at 10:50
  • Why are you not passing $event to your test() function? – Arpit Kumar Commented Nov 6, 2017 at 10:53
  • Pass $event even though it is not working then Try ng-keyup, it is also behaves same like ng-keypress – Vijay Krishna Commented Nov 6, 2017 at 10:54
  • Try input event instead of ng-keypress :p – Ramesh Rajendran Commented Nov 6, 2017 at 10:59
 |  Show 2 more ments

4 Answers 4

Reset to default 2

Finally I had to replace <div> tag with the <button> tag to solve this issue. Button tag worked perfectly for this issue.

<div class="actions">
    <button class="ui approve button red" data-ng-click="test()" id="confirm-yes" tabindex="8" ng-keypress="test()">Yes</button>
    <button class="ui cancel button" data-ng-click="test()" id="confirm-no" tabindex="7" ng-keypress="test()">Cancel</button>
</div> 

it could be because of another handler that invokes event.stopImmediatePropagation(): so far any other handlers are no called

you can check existing handlers for element in browser's Developer tools

You are using same function test() for both ng-click and ng-keypress, try to replace with another function

   <div class="ui approve button red" data-ng-click="test()" id="confirm-yes" tabindex="8" ng-keypress="testcheck()">Yes</div>
    <div class="ui cancel button" data-ng-click="test()" id="confirm-no" tabindex="7" ng-keypress="testcheck()">Cancel</div>

I approached same issue with ngKeypress directive. It's especially interesting that on Angular's official example pressing 'Enter' is recognized.

Solved this problem using ngKeydown directive. It shouldn't make any difference when handling 'Enter' key.

发布者:admin,转转请注明出处:http://www.yc00.com/questions/1744228097a4564108.html

相关推荐

发表回复

评论列表(0条)

  • 暂无评论

联系我们

400-800-8888

在线咨询: QQ交谈

邮件:admin@example.com

工作时间:周一至周五,9:30-18:30,节假日休息

关注微信