What is the current JS solution in Webflow to catch successful form submissions and redirect to a custom link with query parameters?

The current JavaScript solution in Webflow to catch successful form submissions and redirect to a custom link with query parameters is by utilizing the built-in Webflow form submission event and custom code.

​

To achieve this, follow these steps:

​

Step 1: Create a form in Webflow

First, you need to create a form using the form element in Webflow. Set up the required form fields and any other related settings.

​

Step 2: Add a custom code embed

Next, you'll need to add a custom code embed to your Webflow project. Place this embed code within the project settings or on the specific page where the form is located.

​

Step 3: Include JavaScript code

Inside the custom code embed, you can add JavaScript code that listens for the form submission event and performs the desired actions.

​

Here's an example of the JavaScript code you can use to catch successful form submissions and redirect to a custom link with query parameters:

​

```javascript

<script>

  // Wait for the Webflow form submission event

  document.addEventListener('wf-form-submission', function(event) {

    var formId = event.detail.formId; // Get the form ID

    var formSubmissionData = event.detail.data; // Get the form submission data

​

    // Check if it's the desired form

    if (formId === 'your-form-id') {

      // Build your custom redirect URL with query parameters

      var redirectUrl = 'https://example.com/success?foo=bar&baz=qux';

​

      // Perform the redirect

      window.location.href = redirectUrl;

    }

  });

</script>

```

​

Make sure to replace `'your-form-id'` with the actual ID of your form. Also, modify the `redirectUrl` variable to the desired URL with your own query parameters.

​

With this code in place, when a user successfully submits the specified form, the JavaScript code will catch the event, construct the custom redirect URL, and perform the redirect with the query parameters.

​

Remember to test your form thoroughly to ensure that everything works as expected.