Dynamic form redirection

Support
1

I have a form with a custom success page in the action attribute of the form like this:

<form
    name="scholarship"
    action="/thanks"
    method="POST"
    data-netlify="true"
>

Depending of certain form values, I update via JavaScript the action attribute to redirect to a different success page (for example /congratulations), however it always takes me to the default /thanks page.

Is this behavior unsupported?

3

Yup, it is. We record the action at DEPLOY time, and you cannot change it. Perhaps your result page could have conditional behavior instead of trying to have a conditional page address?

4

Another option is to use Netlify functions to handle the form submission and redirect.

Here is an example of how to do dynamic redirects with functions netlify-functions-workshop/redirect.js at master · DavidWells/netlify-functions-workshop · GitHub

On the frontend you would want to point your form action to the function url

1 Like
5

Hey David,

Do you mean pointing your action attr directly to the function URL or setting up a submission webhook to point to the function in the Netlify Forms webhook settings? I’m doing the latter in my current form.

Similar to the OP, I’m trying to use dynamic input names in my form, and I’m starting to realize this isn’t possible through Netlify Forms, because the names are not predefined in Netlify at deploy.

So maybe the solution is to bypass Netlify Forms and hit my function directly, and process my form data there? I suppose I’d just lose some of Netlify’s features (honeypot, GUI submission administration, etc.).

1 Like
6

Yeah you can use fetch to make an ajax request to the Netlify function with the form data.

I like using GitHub - insin/get-form-data: Gets form and field data via form.elements to easily grab up the form data and send that into a function.

1 Like