Hi! I’m trying to build a feature similar to this (hosted on Cloudflare Pages): Think Digital Group - Contact
The flow is that the form is submitted and processed by a function, then depending on the response, the user is redirected back to that same page but with the addition of some query parameters which then renders some feedback into the UI (eg ?success=false or ?success=true) - you can append those to the link above to see the rendered UI.
Is this possible with Netlify functions? At the moment I’m using your form API that triggers a lambda on submission, but I can’t see a way of providing feedback to the user whether it was successful or not.
Site ID is gleaming-melba-90c3d4, PR for this feature is Feat comments by endymion1818 · Pull Request #22 · endymion1818/deliciousreverie-2023 · GitHub
Thanks
Yes
However I’m not sure what you mean by “using your form API that triggers a lambda on submission”
I had a quick look at some of the code in a commit for the repo you linked to but couldn’t immediately spot what you’re doing, are you able to clarify how you’re trying to do it currently?
If you’re using Netlify Forms usually people just set up their form to make the POST request to a route on the site, Netlify’s handling catches it and returns an appropriate response. So if the site has made the request via ajax they then just determine success/failure based on the status received.
In your case though you mention “processed by a function” so I’d imagine you’re doing something other than just submitting the values for collection.
If you are submitting to your own function, then what you return is up to you and how your application handles that response is also up to you, so you could make it do anything.
In your case though you mention “processed by a function” so I’d imagine you’re doing something other than just submitting the values for collection.
Yes, I found here that you can trigger a lambda when a form submission is created: Trigger functions on events | Netlify Docs. It’s this lambda that submits the form to my backend API.
are you able to clarify how you’re trying to do it currently?
The form action is "/comment-thanks/", so the user gets redirected there regardless. If the action is the lambda URL, I don’t know what happens but I’m unable to access the form data. I suspect it’s because routing to that URL means I’m triggering a second lambda.
@endymion1818 I’d expect that a function execution triggered by the submission-created event would be entirely decoupled from the users browser, so it wouldn’t be viable for redirecting the user.
One way you could achieve it would be to chain the calls from the front-end.
So you first call the regular form submission, then upon success call your serverless function and redirect the window location based on the response.
Another way would be to call a serverless function directly which in turn handles the form submission and response etc.
1 Like
Thanks. I’m getting there with it, not able to do redirects from the function which is a shame but at least I can submit and get a useable response.
Thanks for your help Nathan!
1 Like