Events & redirects

Success and error events

The client dispatches DOM events on the form element so you can build your own confirmation or error UX:

• contact-form:success
• contact-form:error

<form data-contact-form id="contact-form">
  <!-- fields -->
</form>

<script src="https://script.app.overtureforms.com/contact-form.bundle.js" defer></script>
<script>
  window.addEventListener("DOMContentLoaded", function () {
    window.ContactFormHandler.initContactForms({
      publicKey: "YOUR_PUBLIC_KEY",
      formId: "YOUR_FORM_ID"
    });

    var form = document.getElementById("contact-form");
    form.addEventListener("contact-form:success", function () {
      alert("Thanks, your message was sent.");
    });
    form.addEventListener("contact-form:error", function (event) {
      console.error("Submission failed", event.detail);
    });
  });
</script>

Controlling the redirect

By default, the redirect after a successful submission is controlled by your form's configuration in the portal. To override it from the page instead, set a redirect attribute on the form:

<form data-contact-form data-contact-form-redirect-uri="/thanks">
  <!-- fields -->
</form>

You can also pass redirectUrl to initContactForms(...). Both the attribute and the option take precedence over the portal-configured redirect.

For safety, only http: and https: redirect URLs are honored — a javascript: (or other) URL is ignored and never executed in your page.