CODEWITHSUNDEEP
jqueryformspreventdefault
BrownChiLD
BrownChiLD

Reputation: 3713

jQuery submit() after preventDefault() not submiting form properly

I've got a form which submits values to paypal ...

before submitting to paypal i wanted to programmatically check the variables and save them to database first

To do this, I have an on(submit) code that intercepts the default form action, and submits the variables to my script first for pre-processing..

then once OK, i then invoke the submit function for the form..

The result = the form is posting BLANK/ZERO variables 

cleared_to_submit = 0;
$("#my_form").on("submit", function(e){


    if(cleared_to_submit){
        cleared_to_submit = 0;
        return;
    }else{
        e.preventDefault();
        postvars = $(this).serializeArray();
        $(this).find(":input").prop("disabled",true);


        url = "?act=pay_now&";
        $.post( url, postvars ,function(data){
            var stat = data.stat;

            if(stat == 'ok'){
                cleared_to_submit = 1;
                $("#my_form").submit(); //resubmit form

            }else if( stat == 'input_error'){

                showAlert(statMsg, "danger");

                $("#my_form").find(":input").prop("disabled",false);

            }else{ // ERROR
                $("#my_form").find(":input").prop("disabled",false);
                showAlert("Error:" + statMsg, "error");

            }
        });
    }




});

Is this an expected side effect?

Upvotes: 1

Views: 6841

Answers (3)

Khairu Aqsara
Khairu Aqsara

Reputation: 1310

try to put $(this).find(":input").prop("disabled",true); after calling $.post method, POST method variable will empty if the input form being disabled

Upvotes: 0

BrownChiLD
BrownChiLD

Reputation: 3713

It's because I disabled the form input fields 

$(this).find(":input").prop("disabled",true);

and didn't re-enable them before calling submit() apparently, if form input fields are disabled, so are their variables.

Upvotes: 1

Kamen Kotsev
Kamen Kotsev

Reputation: 303

Instead of using the flag cleared_to_submit to go around the e.preventDefault(), try using $(this).unbind("submit").submit(); once you've done what you need to do in this $("#my_form").on("submit", function(e){ function.

So basically what I'm trying to say is: once you've validated your form in the .submit() event, you can use this code to submit the form without calling the .submit() event you've bound.

For example:

$("#my_form").on("submit", function(e){
    e.preventDefault();      
    //...validation here
    if(stat == 'ok'){
        $(this).unbind("submit").submit(); // this line will not trigger the same submit event
    }
    //...
});

I'm not certain that this will solve your problem, but it can give you an idea of how to validate your forms easier.

Upvotes: 3

Related Questions