Why Ajax does not work when you press enter

Question

I have one form and I posted POST with Ajax and everything is beautiful. But when I press enter, the url is get and ajax is not working. I want Ajax to work when you press enter ,My codes:

function ajax2(){
 $.ajax({
  type:"POST",
  url:"ajax/alock.php",
  data:$("#formlock").serialize(),
  success:function(e){
   $("#result").html(e);
  }
 });
}

$("#btnlock").click(function(){
 ajax2();
});

/*I want Ajax to work when you press enter */
$("#formlock input").keypress(function(event){
    var keycode = (event.keyCode ? event.keyCode : event.which);
    if(keycode == '13'){
        ajax2();
    }
});

<form role="form" class="form-inline" id="formlock">
    <div class="form-group col-lg-12">
       <input type="password" placeholder="Şifre" name="pass" class="form-control lock-input">
         <button class="btn btn-lock" type="button" id="btnlock">
               <i class="fa fa-arrow-right"></i>
          </button>
     </div>
</form>

Try an event other than keypress, for example `keyup`. and also `event.keyCode` is a number not a string. — rksh1997, Apr 19 '20 at 21:22
You should look here - https://stackoverflow.com/questions/979662/how-to-detect-pressing-enter-on-keyboard-using-jquery — TimBrownlaw, Apr 19 '20 at 21:24

score 0 · Answer 1 · edited Apr 20 '20 at 07:40

0

You need to include ajax library to the file

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>

edited Apr 20 '20 at 07:40

Bhargav Rao

50,140
28
121
140

answered Apr 19 '20 at 21:52

Kacper

1

OP does say that they are able to send it on click, so they must have included it – Anurag Srivastava Apr 19 '20 at 21:55

threeside · Answer 2 · 2020-04-20T06:13:21.197

Test on jsFiddle with jQuery 3.4.1,

Your code work great ... Check your jQuery include

or compatibility : https://www.quirksmode.org/dom/events/keys.html

https://jsfiddle.net/c1vruLhp/

<form role="form" class="form-inline" id="formlock">
    <div class="form-group col-lg-12">
       <input type="password" placeholder="Şifre" name="pass" class="form-control lock-input">
         <button class="btn btn-lock" type="button" id="btnlock">
               <i class="fa fa-arrow-right"></i>
          </button>
     </div>
</form>


    <script>
        function launch() {
            alert('you press enter');
        }

        $("#formlock input").keypress(function(event){
            var keycode = (event.keyCode ? event.keyCode : event.which);
            if(keycode == '13'){
               launch();
            }
        });
    </script>

Why Ajax does not work when you press enter

2 Answers2