Hijack Form's Submit Onclick, Validate, and Use Enter Key to Post Form

Billy Heaton 1 min read

// using jQuery library and validation plugin in this code
// for checking keycodes
function getKeyCode(event) {
var keycode = (event.keyCode ? event.keyCode : (event.which ? event.which : event.charCode));
return keycode;
}

// is there an anchor as Submit button?
var $submit = $('a[id$="_submit"]');
// is there any behavior already on submit, like -> onclick="__doPostBack(...)"
$submit.action = $submit.attr('onclick'); 

$submit.click(function(e){
    // using jQuery validation plugin to validate
    $submit.valid = $('.myform').valid();
    if (!$submit.valid) {
        e.preventDefault();
    } else {
        // process original onclick stuff
        $($submit.action).trigger('click');
    }
});

// submit with enter key
$(".myform input").bind("keydown", function(event) {
    // track enter key
    var keycode = getKeyCode(event);
    // keycode for enter key
    if (keycode == 13) {
         // force the 'Enter Key' to implicitly click the Sumbit button
         $submit.click();
         return false;
    } else  {
         return true;
    }
});

About the Author

Billy Heaton
Billy Heaton

Software engineer with two decades of experience who favors Ruby and JavaScript to build web applications