Jquery dialog submit form by Enter Key

Question

I want submit form for Jquery dialog by pressing enter key.

HTML

<!-- Pin Notification Form -->
<div id="pin-dialog-form" title="Verification Pin">
   <div id="agent_pin_container">
      <input type="password" name="verification_pin" id="verification_pin"
      value="" class="form-control" placeholder="Verification Pin" />
</div>
</div>

JQUERY

$( "#pin-dialog-form" ).dialog({
autoOpen: false,
height: 200,
width: 300,
modal: true,
buttons: {
    "Submit": function() {
        // PROCESS
    },
    Cancel: function() {
        $( this ).dialog( "close" );
    }
},
close: function() {
    $( this ).dialog( "close" );
}
});

Now, I can not use this type of code in here, if (e.keyCode == 13) {. Because, the form is submitted by modal window itself. on the other hand I can not use this,

open: function() {
  $(this).parents('.ui-dialog-buttonpane button:eq(0)').focus(); 
}

because, I need to enter PIN first then focus on submit button. Is there any other way to do it? Thanks.

possible duplicate of [Submitting a form on 'Enter' with jQuery?](http://stackoverflow.com/questions/699065/submitting-a-form-on-enter-with-jquery) — Luca B., Aug 22 '14 at 14:31
I already mention those scenario in my question. It's not duplicate of that question. — RNK, Aug 22 '14 at 14:34
You should combine it with http://stackoverflow.com/questions/2878983/capture-key-press-without-placing-an-input-element-on-the-page then — Luca B., Aug 22 '14 at 14:35
@LucaB.: Can you please combine those 2 in here. I don't know how to do that. If you can then that would be a great help. thanks. — RNK, Aug 22 '14 at 14:38

score 2 · Answer 1 · edited May 23 '17 at 12:23

2

As per comments you should be able to grab keypress document-wide using:

$(document).keypress(function(e){
  if (e.keyCode == 13) {
    // CODE TO SUBMIT THE FORM either AJAX or *form*.submit()
    // CODE TO CLOSE THE MODAL
  }
});

sources:

Submitting a form on 'Enter' with jQuery?

Capture key press without placing an input element on the page?

edited May 23 '17 at 12:23

Community

1
1

answered Aug 22 '14 at 14:41

Luca B.

638
4
13

Jquery dialog submit form by Enter Key

1 Answers1