Form submit redirect- open in new tab?

Hey,

I’m trying to have a form submit redirect URL open in a new tab. I used target=_blank but don’t seem to be having any success with that.

Here’s a screenshot

Here’s a read-only link: https://preview.webflow.com/preview/new-site-test-ea219e?utm_medium=preview_link&utm_source=designer&utm_content=new-site-test-ea219e&preview=4e66671f07b250cb9f250e662414d97d&pageId=5f3a6aa7bba6e94943e44365&mode=preview

And here’s the page in question Miami Beach Boat Rentals from $120

Any assistance would be great

Thanks

Is there a reason that you are using a form instead of a normal button?

Because with a normal button its easy.

Hey Matzinger, yes there is a reason we using the form instead of as button. I know how to open in new tab on a normal button but having trouble with the form submit one even with the target _blank inserted

Has anyone found a solution to this? I am having the same issue.

We are having users submit an email to receive a PDF but I want the PDF to open in a new tab.

I have tried to add a custom attribute target=_blank and that did not work.

Thanks

2 Likes

I had the same problem. I solve it with some custom code.

I have a form where people are supose to put their email adress, then they hit the submit button and the PDF open in another tab. And of course, I want only people who have given their email address to see the PDF.

To make this work you need to :

  • give an ID to the field where people enter the address (in the script “ID-of-the-email-field-in-form”)
  • give an ID to the submit button. (in the script “ID-of-the-send-button-of-the-form”)

What the script does is simple: it waits for a click on the button (button.AddEvent…). When there is a click on the button it looks at what is in the address field*(document.getElementById(“ID-of-the-email-field-in-form”).value)*. If there is something then it launches “window.open” which opens the new tab with the pdf file.

<script>

  Webflow.push(function clickMe() {
  const button = document.getElementById("ID-of-the-send-button-of-the-form");
  button.addEventListener("click", event => {
  var emailAdress = document.getElementById("ID-of-the-email-field-in-form").value;
  if (emailAdress!="")
  {
  window.open('https://adress-of-the-pdf-file.pdf', '_blank');}
  });
})();



</script>

Hope this help :grinning:

2 Likes

Thanks @Romuald_Jay this is super helpful and works like a charm :wink:

This worked really well, Thanks so much @Romuald_Jay

Thanks so much @Romuald_Jay !!! Still works great in 2024.