return true after jQuery validation wont submit my form

Question

I have a form that I am validating with jQuery, once validation is passed I want to submit the form:

    $(document).ready(function(){
        $('[name="form"]').submit(function(e){
            e.preventDefault();
            var one = $('[name="one"]');
            var two = $('[name="two"]');
            var three = $('[name="three"]');
            var errors = [];

            if(!one.val()){
                errors.push(one);
            }
            if(!two.val()){
                errors.push(two);
            }
            if(!three.val()){
                errors.push(three);
            }

            if(errors.length > 0){
                $.each(errors, function(i, v){
                    $(v).css('border', '1px solid red');
                });
            } else {
                console.log('true');
                $('#bmi-form').submit();
            }
        });
    });

My idea was that the return true at the end would submit the form but it does nothing..

In the console I see the console.log('true');

So how can I submit the form on validation success... I dont want to use any plugins as it is a very small app and there is no need to bloat it.

Regards

because you already use prevent default. try to submit form with id of form — azhar_SE_nextbridge, Sep 10 '15 at 10:44

Jai · Accepted Answer · 2015-09-10T10:50:26.413

As you are using e.preventDefault(); which stops the form to get submitted. Now you can .submit() the form instead of return true;:

} else {
    console.log('true');
    this.submit(); // return true;
}

or remove the e.preventDefault() and change to this code to submit only when there are no errors:

if(errors.length > 0){
    $.each(errors, function(i, v){
        $(v).css('border', '1px solid red');
    });
    e.preventDefault(); // put e.preventDefault(); stop to submit incase of errors
} else {
    console.log('true');
    // just remove the return true; from here because if everything is 
}   // fine form will submit. Or you can just remove the else block.

I did try this but I get console.log('true') 1400 times in the console and the form still doesnt submit... — Rik89, Sep 10 '15 at 10:48

score 0 · Answer 2 · edited May 23 '17 at 12:14

0

User $("form").submit(); if your data is in form or of dynamically validation is created then do ajax call; References

API

submit-a-form-using-jquery

edited May 23 '17 at 12:14

Community

1
1

answered Sep 10 '15 at 10:45

Chintan7027

7,115
8
36
50

score 0 · Answer 3 · answered Sep 10 '15 at 10:45

You need to submit your form...

$("formid").submit();

$(document).ready(function(){
        $('[name="form"]').submit(function(e){
            e.preventDefault();
            var one = $('[name="one"]');
            var two = $('[name="two"]');
            var three = $('[name="three"]');
            var errors = [];

            if(!one.val()){
                errors.push(one);
            }
            if(!two.val()){
                errors.push(two);
            }
            if(!three.val()){
                errors.push(three);
            }

            if(errors.length > 0){
                $.each(errors, function(i, v){
                    $(v).css('border', '1px solid red');
                });
            } else {
                console.log('true');
                $("formid").submit();
            }
        });
    });

after some debugging it seems that the $('formid').submit(); is looping the code above and resubmitting the form loads of times.. — Rik89, Sep 10 '15 at 11:01

return true after jQuery validation wont submit my form

3 Answers3