How to continue runing execution after form submit?

Question

Hello, I am writing a simple form submit function for a specific site. The script fills the specific form on the current page and submits the form. It MUST also fill the second form which appears after the first form is submited and submit this form too.

That is there are 2 forms that must be filled and submitted.

Problem however, is that on a normal page the script fills and 1st form and submits it. After submission however, the script stops working! I want to continue execution!

Ive done it by mistake on a page that had 2 frames! most pages dont have frames!

any help????? i am stuck.

function FillFirstForm(){

doc=document;
//Some code removed from above...Fill Values
doc.forms[0].name.value = answerarray[1];
doc.forms[0].address.value = answerarray[2];
doc.forms[0].phone.value = answerarray[3];
doc.forms[0].username.value = answerarray[4];

//And Press Button
doc.forms[0].submit.click();

iTimer=setInterval(FillSecondForm,5000);
return true;

}

function FillSecondForm(){
clearInterval(iTimer);
doc.forms[0].tags.value = answerarray[5];
doc.forms[0].reference.value = answerarray[6];
document.forms[0].submit.click();
return true;

}

Answer 1

The basic rule is that a classical form submission halts all execution of scripts of the page, and loads the next page. No way to do anything about that.

You may have to switch to sending your form's contents using Ajax. That will leave the current page alive, and allow you to do as many submits as you want to.

A very easy way to achieve this is the jQuery form plugin. It takes much of the manual hassle out of the process.

Answer 2

Can you call FillSecondForm() function on body load of second form, once first form submitted.

Answer 3

You could POST the first form with AJAX, and then submit the second form after receving the response for the first form.

Something like this perhaps:

function FillFirstForm() {

    var post_data = 'name='+escape(answerarray[1]);
    post_data += '&address='+escape(answerarray[2]);
    post_data += '&phone='+escape(answerarray[3]);
    post_data += '&username='+escape(answerarray[4]);

    // TODO: make this cross browser :)
    var req = new XMLHttpRequest();

    req.onreadystatechange = function() {
        if ( req.readyState == 4 ) { // The request has finished
            if ( req.status == 200 ) {
                FillSecondForm();
            }
            else {
                // Deal with errors here
            }
        }
    };

    req.setRequestHeader("Content-type","application/x-www-form-urlencoded");
    req.open('POST', '/submit_url', true);
    req.send(post_data);
}

W3 schools has a tutorial on AJAX here: http://www.w3schools.com/ajax/ajax_xmlhttprequest_create.asp, and there are many more on the web.