How to TOTALLY disable a webflow default form action?

Community resources General
1

Hello,

How do one disable the default action of a Webflow form ?
I need to implement a usebasin form action, unfortunately Webflow form action always triggers despite the custom javascript code supposed to disable it.

Did someone ever succeeded in disabling Webflow form ?

Here is the code I used:

document.addEventListener("DOMContentLoaded", () => {
  disableDefaultFormSubmission();;
});

function disableDefaultFormSubmission() {
  Webflow.push(() => {
    $("#inscription").submit(() => {
      console.log("default form submission canceled");
      return false;
    });
  });
}
2

Any time you specify an action in form setting, Webflow’s default handler is suppressed, and it behaves like a regular HTML form. It does not matter what action you specify, even # or a webhook URL should suppress Webflow’s handling scripts.

However that also means that Webflow’s inline success / fail messages are no longer managed. If you want both - Basin, and the inline success message, you can use Sygnal Attributes.

We use Basin on all of our client sites as well.
Here’s a video walkthrough on how to set that up.

3

I stick a preventDefault() in my Javascript to stop that and just handle it myself. Here’s a code example.

4

Hi Michael,

Thank you for getting back to me.
Unfortunately the video on your website doesn’t seem to load for some reason ?
Also I tried click on the Form Webhook Handler but I got an error page

Screenshot 2023-06-13 140049
Screenshot 2023-06-13 1400493840×1972 164 KB

Screenshot 2023-06-13 135943
Screenshot 2023-06-13 1359431912×1360 114 KB

5

Thanks Anthony, that’s a strange combination of issues.
I’d guess Loom is still recovering after the AWS outage, so I’ve messaged support about the video. Others seem to be playing fine.

The Webflow URL glitch was quite odd too and unrelated.
That link is re-set, and here it is directly.

6

Well, apparently the AWS outage glitched some Loom storage; support says this one cannot be recovered- so I’ve re-recorded it.

7

@memetican Thanks, this is great! It solves most of my problems!

1 Like