javascript - Redirect to any page and submit form details -
i'm looking submit form details using method="post"
external url, redirect user 'thank you' page after completing form.
my sample html/javascript follows, page not redirecting google.com intended. on fixing appreciated!
html:
<form action="externalurlhere" method="post" name="theform" id="theform" style="margin-bottom:0px;padding:2px;background-color:#e0e0e0;" onsubmit="return mm_validateform(); return redirect();">
javascript:
function mm_validateform() { if ( !jquery('#theform #firstname').val() ) { alert('please input first name.'); jquery('#theform #firstname').focus(); return false; } if ( !jquery('#theform #lastname').val() ) { alert('please input last name.'); jquery('#theform #lastname').focus(); return false; } if ( !jquery('#theform #daytimephone').val() ) { alert('please input phone number.'); jquery('#theform #daytimephone').focus(); return false; } if ( !jquery('#theform #email').val() ) { alert('please input email.'); jquery('#theform #email').focus(); return false; } if ( !jquery('#theform #bid').val() ) { alert('please select preferred campus.'); jquery('#theform #bid').focus(); return false; } if ( !jquery('#theform #programs').val() ) { alert('please select preferred program.'); jquery('#theform #programs').focus(); return false; } if ( !jquery('#theform #how_heard').val() ) { alert('please select how heard us.'); jquery('#theform #how_heard').focus(); return false; } return true; } // ]]></script> <script type="text/javascript"> function redirect() { window.location = "www.google.com"; return false; } </script>
when user clicks submit button, onsubmit event occures, and, depending on return value of function binded event, form submits (return true) or not submit (return false); function may binded event using html:
<form onsubmit="if(/*some validation here*/){return true;} else {return false;}"></form>
or in javascript script itself:
form1.onsubmit=function(){if(/*some validation here*/){return true;} else {return false;}}
generally, not matter;
know, function's body executed until "return" occures. immediatly stops , return value passed function invoker. so, have wrote in onsubmit="" html tag attribute equivalent of following js code:
form1.onsubmit=function(){ testpassed=validate(); return testpassed; somevalueredirectfunctionreturns=redirect(); return somevalueredirectfunctionreturns; }
so, can see, no matter if form data test passed or not, because validate() function's return value (true if form okay , false if user has entered bad data) immediatly returned in event function. so, redirect() function cannot occur, because onsubmit event handler function stopped , value returned;
make work, should modify code:
form1.onsubmit=function(){ if(!validate()) return false; //test failed, form not passed, no need redirect "thank page". else redirect(); }
so, redirect function will called if form validation test passed. right here ran in problem.
way, if onsubmit event handler function defined, submit form return true;
-- return function, means stop , proceed executing called. when change window.location propterty of page in function, redirection occurs immediatly, function not return;
-- javascript execution immediatly interrupts, , new page starts loading -- of course, no data can passed via form submition;
so, have to
- submit form (if data valid) --
return true;
- somehow redirect (this means, continue execute js code @ page) from page form submitted.
and... not possible.
can't continue executing js code after form sent because:
- the event handler function has returned. means stopped.
- the form sent, , page loading. js code of previous page lost, , cannot executed anymore.
- this means, can't affect behaviour of page loading (in synchronous mode) page, has started loading. , can't make new page redirect page want ("thank you" one). usual form sending loading new page additional parameters. e. g. can't modify page link on page following to;
anyway, there still several ways acheive want:
- if own page, form submitted, may receive data of form , immediatly send redirection header. e. g., via php on server side.
- if page not yours (you can't modify neither server, nor page, nor on server side), have work form in different way(s):
- use frames or floating frames, either loading data frame(s) javascript code itself, or loading page (from same server on form page located), have permission modify, , modify it. e. g.:
- in 1 frame, make form user enters data;
- in frame, make form contains same fields first does, hidden ones;
- do not submit first form, pass data second form, ,
submit()
second one; - redirect first frame (or whole page) "thank you" page;
- the first frame may hidden (css:
display:none
) -- won't affect functionality.
- use ajax. special technology of making http request (submitting form!) javascript code without reloading actual page. there may problems, if try send data externalurlhere page, if not yours. if so, may create "router" page on server, receive data sent form , route target, externalurlhere page. may even...
- don't use ajax. make router page (when "page", mean phpscript, or cgi technology), display "thank you" html document.
- and on...
- use frames or floating frames, either loading data frame(s) javascript code itself, or loading page (from same server on form page located), have permission modify, , modify it. e. g.:
i've tryied make complete answer, possible, hope has helped.
p. s. sorry english.
p. p. s. first answer on stack overflow -- may doing wrong, sorry.
Comments
Post a Comment