I have this issue and I don't really understand what's going on..

I've got a form on an old site, which submits the data to a google sheet.

<form action="https://docs.google.com/a/sheeturl" method="post" target="hidden_iframe1" onsubmit="window.location='thankyoupageurl'">

which works perfectly fine - submits the data to google spreadsheet and redirect the user to a custom thank you page on the site.

I now try to mimic this behavior on a new website but with exactly the same code, it does not redirect to the thank you page - instead, it sends the data and goes to the default Google Forms thank you page.

Looking at the working code on the old web, I don't see any javascript attached, which would further alter the redirect behavior.

The new code (actually same code, new website) does indeed redirect to the page I want, but also opens the Google forms thank you page on top of that, in a new tab.
So I added

jQuery('#submitForm').click(function(event){
event.preventDefault();
});

to prevent this... but now the submit button does not do anything at all!

How can I prevent the submit button to trigger opening a new tab ?

The onsubmit in the old code is JavaScript. Bad JavaScript - We should never bind event handlers directly in the HTML, you pollute the global scope doing this.

 

In your new code you are doing a click event on your form. You should instead be doing a submit event. And use the `on` method for this.

$('#submitForm').on('submit', function(evt) {
  evt.preventDefault();
  // do something else.
});

It's also worth noting that your code should be wrapped in a DOM ready event.

 

But all this aside I highly recommend you spend time learning JavaScript from a reputable source before you start working with jQuery.

Thanks.

 

So I remved the onsubmit from the html and this is what I got now:

<script>
jQuery(document).ready(function ($) {
$('#submitForm').on('submit', function (evt) {
window.location = 'http://thankyoupage';
evt.preventDefault();
});
});
</script>

However I got the very same problem.. it does redirect to my thank you page, but doesn't send the data.

If I remove the evt.preventDefault(); it redirects again to the default Google Forms thank you page (which I don't want) and also sends the data.

 

I am now sure why it doesn't work with just the window.location redirect. That way it should theoretically submit the data first and then redirect to my local thank you page..

 

It's also worth noting that your code should be wrapped in a DOM ready event.

 

I never understood why though Will need to do some reading on that.. but first I need to solve this quite urgently..

Edited December 1, 201510 yr by mccloud

You need to read up on Ajax. to send the form data, it's a lot more involved than doing a simple window.location.

You need to read up on Ajax. to send the form data, it's a lot more involved than doing a simple window.location.

well, of course. I don't expect the data to be sent within the redirect request.

I though it was possible to send the data and just prevent any further behaviour...

 

Here's the old site where it works perfectly fine. I don't think there's any additional javascript involved, right ?

The Ajax is javascript. You don't use window.location you use ajax to make the request to the server along with sending the form data.

To prevent the default action of the form you have to capture the event and prevent it. So there's a load more JavaScript required to make this work. You also need some server side handling to make all this work.

 

You can read up on jQuery here http://api.jquery.com/jquery.ajax/

 

and preventing default actions https://api.jquery.com/event.preventdefault/

Aah, yes.. you're right. After further inspection of the old website, it's using html Iframes to accomplish the 'redirect' - which is technically not a redirect after all and I don't think it's the proper way to do this (nevertheless, they accomplish the goal).

 

That's why I though it is relatively easy to accomplish. I've never dealt with this before, so I wasn't familiar with the procedure / technique.

 

Thanks for the info.