The problem with action URL in forms

At a glance

The community member is having trouble with the action URL in a form they created, where they are trying to send a webhook to n8n but it's not working. They noticed that the "action=" attribute is not present in the code when they publish the site. Other community members suggest trying a webhook form instead of a regular form, and note that the real action URL is added on the server-side to hide the authentication token. The community member tests a new webhook form but still encounters issues, and they eventually figure out that the problem was likely due to the way they inserted the URL in the action field. They delete and re-enter the URL, and it starts working. The community member also asks how to add a form success URL (thank you page) instead of a standard message, and a community member provides a workaround for that.

Useful resources

aalex FR

Friends, tell me what is the problem with action URL in forms
I made a simple form with one field and a button, I try to send a webhook to n8n - and it doesn't go away.
in the action field I write the necessary webhook URL I publish the site - but there it is not “action=” in the code.....
what the hell? do the forms even work?

24 comments

BBogdan

Is it form or webhook form?

aalex FR

this is form from forms

BBogdan

Try webhook form instead

BBogdan

from data

BBogdan

Attachment

BBogdan

It will hide webhook auth on server

aalex FR

The result also the same... action specified in webstudio does not correspond to what I see in the code, and naturally nothing is sent by webhook.

Attachments

BBogdan

And this is expected. The real action is added on server to hide auth token from client side

BBogdan

Missing action in regular form seems like a bug

aalex FR

ok
test form (standart webhook form) - just edited field names and action
https://launey-a378t.wstd.io/ru/test-form

test webhook URL (post method as it is in code), that is in action field in webstudio
https://n8n.navi.training/webhook-test/799035af-fc66-48bb-bd5c-66dad4df3219

what can be wrong?

BBogdan

I think need to start listening for test webhook on n8n side

aalex FR

Attachment

BBogdan

Alright, this

Attachment

BBogdan

type=button does not submit form

BBogdan

type=submit does

BBogdan

did you set it?

aalex FR

That's weird, I don't think I did.
but if you create a new one WF, it is set to submit
I probably accidentally hooked it.
Thanks!

But it still doesn't work after switching.

Attachment

OOleg Isonen

tested a new webhook form and button is type submit by default

aalex FR

Thanks for your patience friends! I think I figured it out, the problem was probably in the way the URL was inserted in the action field.
I deleted everything and put it back together again and it worked.

BBogdan

Was it some browser autocomplete?

aalex FR

No it's probably a minor bug, but because I'm not yet familiar with webstudio.
I'm not sure I can replicate it.
I first tried adding a URL to the action field via expression editor, when it didn't work I deleted the expression and added in quotation marks again it didn't work, and then without quotation marks and changed the url a few more times. Probably after the first two operations something remained and although in the visual environment everything looked right. I deleted the form and created a new one, then it worked.

and another question how to add form success URL (thank you page) to use it instead of a standard message?

OOleg Isonen

success message or a completely separate success page?

OOleg Isonen

success message is part of the component, you can drop there any instance and even make it fulscreen if needed, but if you want a separate page, currently requires this workaround:

https://github.com/webstudio-is/webstudio/issues/3530#issuecomment-2317596011

aalex FR

Thank you! That's an interesting way to do it, I'm going to try it now!

Add a reply

Join the Webstudio community

The problem with action URL in forms