submit form without redirecting

Question

I want to submit a form to action page which is a different site however i don't want to be directed to the action page. i've tried everything but its not working for me, i've heard about ajax does the job can someone give me examples

What I want:

i want to submit a form but not be redirected
submit the form as i'm being redirected to action page i get redirected to my original page.

My code:

<form id="user-login-form" accept-charset="UTF-8" action="http://xxxxxn" method="post"> <div> <div class="user_login_block&amp;op=Log+in"><label for="edit-name"><span class="form-required" title="This field is required.">*</span></label> <input type="hidden" /> <div> <div class="user_login_block&amp;op=Log+in"><label for="edit-name"><span class="form-required" title="This field is required.">*</span></label> <input type="hidden" /> <input class="form-text required" id="edit-name" type="hidden" maxlength="60" name="name" size="15" value="xxxxxx2" /></div> <div class="form-item form-type-password form-item-pass"><label for="edit-pass"></label> <input class="form-text required" id="edit-pass" type="hidden" maxlength="60" name="pass" size="15" value="9sQ&amp;ampzW#7PKhpqbzcCFz9jvY" /> <input type="hidden" /></div> </div> <input type="hidden" name="form_build_id" value="form-odWc3MFMsKIL_5vCQtPmiv0AVf0tFwBu7eP2-8" /> <input type="hidden" name="form_id" value="user_login_block" /> <div class="form-actions form-wrapper" id="edit-actions"><input class="form-submit" id="edit-submit" type="submit" name="op" value="submit" />

You need to make an attempt in solving the problem before coming here to ask for help. AJAX is indeed the right way; what have you tried whilst trying to implement AJAX so far? There are a number of tutorials out there to help... — Mathew
– Mathew, Commented Jan 14, 2014 at 13:59
ive tried many things even the code below, but its not working — user3182036
– user3182036, Commented Jan 14, 2014 at 14:30
Possible duplicate of How to submit html form without redirection? — StefansArya
– StefansArya, Commented Aug 28, 2017 at 15:30

Susheel Singh · Accepted Answer · 2014-01-14 14:44:40Z

Check the below example:

check this link: http://susheel61.0fees.net/ajaxtest.php

NOTE: This is basic a example for ajax. You cant do it many other ways like using $.post, $.get etc. but $.ajax has many options like showing a loading image before the content loads.

html:

<!doctype html> <html lang="en"> <head> <meta charset="utf-8"> <title>ajax example</title> <script src="http://code.jquery.com/jquery-1.9.1.js"></script> </head> <body> <div id="message"></div> <form id="myform" action="test.php"> <input type="text" name="test"/> <input type="submit" value="submit"/> </form> <div id="response"></div> <script> $(function() { $("#myform").on("submit", function(e) { e.preventDefault(); $.ajax({ url: $(this).attr("action"), type: 'POST', data: $(this).serialize(), beforeSend: function() { $("#message").html("sending..."); }, success: function(data) { $("#message").hide(); $("#response").html(data); } }); }); }); </script> </body> </html>

Do i have to place the above code you gave in my form or outside my form
I updated the answer please check. you keep the javascript in head also. but best practice is to put it at the end
I tried the above code but it's not working i'm being redirected to the action page
just copy and paste the above code and change the form code for yourself. it should work fine. you are doing some mistake and you must know debugging..

ohjeeez · Accepted Answer · 2016-02-17 18:55:48Z

If nothing works, you could redirect to a hidden iframe.

<iframe id="iframe" name="my_iframe"></iframe> <form class="form" id="userform" target="my_iframe">

Prakash R · Accepted Answer · 2014-01-14 14:00:42Z

try this:

$('form').submit(function(event){ var serialObject = $(this).serialize(); //ex for post request $.post('path_to file',{ parameters:serialObject },function(data){ // do something after submitting }); }); event.preventDefault()

user6062340 · Accepted Answer · 2016-03-14 18:14:15Z

In the php, you can redirect to back to the form by using headers:

header('Location: yourwebsite.com');

Hopefully this works for you

Collectives™ on Stack Overflow

submit form without redirecting

4 Answers 4

6 Comments

1 Comment

Comments

Comments

Linked

Hot Network Questions

Collectives™ on Stack Overflow

4 Answers 4

6 Comments

1 Comment

Comments

Comments

Linked

Related