Manually change form state (using Javascript)

[aez90 (Antoine Zambelli)]

Hi, I’m using custom forms (not submitted to WF) on my site, but I like the success/failure status looks. Since I’m not “submitting” the form to Webflow per se, that event never triggers.

One workaround would be to do a show/hide effect for the success/error messages. But is there a way to change the state in javascript? Something like document.getElementById('myForm').state = "success" ? Or do I have to find some other way?

I guess what I’m asking is how Webflow is changing from the form to a success/error message. Thanks!

[aez90 (Antoine Zambelli)]

Found how to do it, I feel pretty dumb.

The error message div (which you can show by toggling the settings on the form element) can be assigned an ID. Then all you need is to embed a piece of code like this (to execute if your server returns an error, say):

document.getElementById('my-form-error-message').style.display = "block";

or

document.getElementById('my-form-error-message').style.display = "none";

to hide it again.

Problem solved, hope it can be of use to someone. Cheers!