CODEWITHSUNDEEP
phpjqueryajaxforms
Rafael Sedrakyan
Rafael Sedrakyan

Reputation: 2629

Submiting form with jquery

I have a form and I need to add some data from database before submiting it. My html code is:

<form action="https://91.199.226.106/services/authorize.php" id="arca" method="POST">
        <input type="hidden" name="hostID" id="hostID"/>                                                                                                                                                                                                                                            
        <input type="hidden" name="mid" id="mid" />
        <input type="hidden" name="tid" id="tid" />
        <input type="hidden" name="additionalURL" id="additionalURL" />
        <input type="hidden" name="orderID" id="orderID" />
        <input type="hidden" name="currency" id="currency" />
        <input type="hidden" name="opaque" />
        amount<input type="text" name="amount" id="amount" value="" /><br>
        <input type="submit" value="submit" />
    </form>
    <div id="script_area"></div>
    <div id="error_area"></div>

And I have an event handler for form submit. Here is the code:

$("#arca").submit(function(e){
            e.preventDefault();
            var data="amount="+$("#amount").val()+"&&lang=eng";
            $.ajax({
                url: "ajax/get_arca_submit_params.php", 
                type: "POST",       
                data: data,     
                cache: false,
                success: function (html) {
                    var splited=html.split("|",2);
                    if(splited[0]=="0")
                    {
                        $("#error_area").html(splited[1]);
                    }
                    else
                    {
                        $("#script_area").html(splited[1]);
                        $("#arca").submit();
                        //alert("aaaaa");

                    }
                }   
            });
        });

The PHP returns

"0|error message" or "1|script that sets fields values" that I place in the div with id="script_area"

. The problem is that $("#arca").submit(); line ceeps on submiting the form on and on. How can I solve this problem? Thanks for help.

Upvotes: 0

Views: 169

Answers (2)

Darin Dimitrov
Darin Dimitrov

Reputation: 1038720

Replace $("#arca").submit(); with $("#arca")[0].submit();. This way you are calling the submit event on the underlying DOM element which won't trigger your callback and avoid the infinite loop.

Upvotes: 3

xdazz
xdazz

Reputation: 160833

You could change to bind a click event to submit button instead.

$("#arca").find('input[type="submit"]').click(function (e) {
    e.preventDefault();
    var data = "amount=" + $("#amount").val() + "&&lang=eng";
    $.ajax({
        url: "ajax/get_arca_submit_params.php",
        type: "POST",
        data: data,
        cache: false,
        success: function (html) {
            var splited = html.split("|", 2);
            if (splited[0] == "0") {
                $("#error_area").html(splited[1]);
            } else {
                $("#script_area").html(splited[1]);
                $("#arca").submit();
                //alert("aaaaa");
            }
        }
    });
});

Upvotes: 0

Related Questions