Question

Having trouble trying to get this simplified. Still somewhat new to jQuery so please forgive me if this is something simple I am missing.

I have set up an AJAX request on the send of a form through a click event. However, I need the ‘enter’ key to work as well instead of just reloading the page when sending.

This is what I am working with:

$('#submit').click(function() {
     //Do AJAX Stuff
});

$('#submit').keydown(function (e){
if(e.keyCode == 13){
     //Do AJAX Stuff
}
})

So what I’m trying to say is can I combine these two functions for the same AJAX request?

Answer 1

Just bind a submit handler to your form (not the submit button). It takes care of all of these cases:

$('#your_form').submit(function(e) {
    var $this = $(this);
    e.preventDefault(); // Prevents the form from submitting regularly

    $.ajax({            // Sends the appropriate AJAX request instead
        url: $this.attr('action'),
        type: $this.attr('method'),
        data: $this.serialize(),
        success: function(response) {
            alert(response);
        }
    });
});