Form submit on keyCode == "enter" (13)

Question

I need to submit the content of a form when I press the Enter key, but only if the form has no error message. I built up the following function:

$(targetFormID).submit(function (e) {
    var mess = error_m(targetDiv);
    if (e.keyCode == 13 && mess.length > 0) {
        e.preventDefault();
        e.stopPropagation();
    }
    if (mess.length == 0 && e.keyCode == 13) $(targetFormID).submit();
}); 

In this function the mess variable is getting the error message returned by function error_m, the rest is simple code condtion but it doesn't work.

Need some help with this!!

Solution

Submitting the form when the Enter key is pressed is default browser behaviour. Don't mess with it. Just validate the form in the submit event.

$(targetFormID).submit(function (e) {
    var mess = error_m(targetDiv);
    if (mess.length > 0) {
        e.preventDefault();
    }
});

One other possible problem: what is targetFormID? If it's actually a string containing an element ID, you'll need

$("#" + targetFormID).submit(/* Same function as above */);

If it's a reference to the form element then $(targetFormID) is fine but your variable is misleadingly named.

Comments

[JayC]

If you have multiple forms on the page, you might have to implement such a solution, especially if focus often is not on one of the form elements of the "default" form (well, that's what I remember from having to do something like this over 4 years ago).