Re-enable Enter key press on a text field

Question

I'm using this logic: Jquery: how to trigger click event on pressing enter key to press Submit button on Enter key press.

But on a web page Enter key seems to be disabled as Enter key press isn't invoking the callback attacthed to keypress function:

var otp_fun = function (otp_sel, cmd_btn_sel) {
            $(otp_sel).css({
                'font-size': '2em',
                'color': 'red',
                'height': '3em',
                'width': '12em'

            }).attr('type', 'text').focus().keypress(function (e) {
                if (e.which == 13) {
                    e.preventDefault();

                    console.log("otp_sel len=",$(otp_sel).val().length);
                    if ($(otp_sel).val().length >= 4)
                    {
                        console.log("pressing eeee button");
                        $(cmd_btn_sel).trigger('click');

                    }
                    return false;
                }
                else
                {
                    console.log("e.which=",e.which);
                }
            });
        }

How to re-enable this Enter key?

from what i can tell you are attaching a keypress on a function,why? — madalinivascu, Apr 26 '16 at 08:07
For god sake, please use short and meaningful variable names. — Kalpesh Singh, Apr 26 '16 at 08:34

wilsonzlin · Answer 1 · 2016-04-26T09:24:35.960

Attach the event handler to the window or document object:

$(window).keypress(function(e) {
  if (e.which == 13) {
    e.preventDefault();

    console.log("otp_sel len=", $(otp_sel).val().length);
    if ($(otp_sel).val().length >= 4) {
      console.log("pressing eeee button");
      $(cmd_btn_sel).trigger('click');
    }
  } else {
    console.log("e.which=", e.which);
  }
});

This will allow the user to press Enter anywhere to trigger the Submit button. If you want it to only work when focused on an element, change the window to the element's selector. This code needs to be run before it can work, so don't put it in a function that isn't called immediately.

score 0 · Answer 2 · answered Apr 26 '16 at 09:18

       var otp_fun = function (otp_sel, cmd_btn_sel) {
        $(otp_sel).css({
            'font-size': '2em',
            'color': 'red',
            'height': '3em',
            'width': '12em'

        }).
  attr('type', 'text').focus().keypress(function (e) {
  var key = e.which;
  if(key == 13)  //  Enter key Code 
   {
     $(cmd_btn_sel).trigger('click'); 
   }
 });

Re-enable Enter key press on a text field

2 Answers2