[JQuery] Stop the submit

JavaScript
1

Provided i have a form which has a valid action url and a submit input, but in JQuery I made something like

$("#myform").submit()

Now in this will check the form, if anything wrong, it should stop the submit process triggered by the button… how can I do that stop??

Currently i’m getting the error message, but the submit is continuing…

2

I don’t use JQuery, just JavaScript. :confused:

For internet explorer you’d use the event.returnValue=false and for DOM compliant browsers use {event}.preventDefault().

Hope that helps, cheers.

3

Isn’t that only if you’re using the W3C model of event registration? Otherwise couldn’t you just write return false; at the end of the submit() function…

4

Okay but if i write return false at the end, the whole submit will not take place as per my scenario, i want it to be canceled only when, let’s say i found that there is an empty field, otherwise it should continue normally.

— never mind i can check for a Boolean empty or not…

5

Isn’t that only if you’re using the W3C model of event registration? Otherwise couldn’t you just write return false; at the end of the submit() function…
Usually, I like suggesting use of unobtrusive JavaScript to people (as long as no one has to jump through hoops).

You can use return false, but you would have to use the return keyword in the attribute on function call.


function f()
{
//validate
//return (true or false)
}

HTML FORM
onsubmit='return f()'
6

Okay but if i write return false at the end, the whole submit will not take place as per my scenario, i want it to be canceled only when, let’s say i found that there is an empty field, otherwise it should continue normally.
You can do it with conditionals:

if(
validateName(firstName) &&
validateName(lastName) &&
emailValidate(email)
)
{return true}
else
{return false}

7

Thank you…
There are a lot of fields actually… and i was using a .each… so making a boolean var worked great…

8

How is return false obtrusive? You can just as easily put it in an external js file.

9

I was confused earlier tictike. As long as you write submit as a method instead of a form attribute you can do it.

10

Getting back to the OP, this page shows you how to properly handle the submit method with jQuery
http://docs.jquery.com/Events/submit#fn

If there are a lot of conditionals, you should use a boolean variable which determines if the validation is still valid.


var isValid = true;
$("form").submit(function() {
    if ($("input:first").val() !== "correct") {
        $("span").text("Not valid!").show().fadeOut(1000);
        isValid = false;
    }
    return isValid;
});
11

If you like too, you can use the filter method instead of each, and return true from each filtered item if they fail validation. That way you can check the size of the end result, and if there are any elements remaining you know the validation failed.

The following is some pseudocode that indicated the type of things you can do with the filter method, instead of the each method.


var $invalidFields = $(selector).filter(function () {
    var notValid = false;
    if (condition) {
        // do stuff
    } else {
        // do failed stuff
        notValid = true;
    return (notValid);
});
if ($invalidFields.size() > 0) {
    // failed validation
    return false;
}
12