Contact Form Webhooks

Hi Guys,
I am an integrator and have many clients that use Wix. The issue im encountering is that there is no simple way to grab a contact form submission and send the data via post to an endpoint.
I went through the documentation but couldnt find anything remotely close to what I am looking for.
Would appreciate some guidance here if possible :).

3 Likes

I would like to invoke Integromat webhook instead of Zapier: https://www.integromat.com/en/integrations/gateway

I have a good experience with it and static websites where I can integrate it with simple form action:

<form action="https://webhooks.integromat.com/xxxx">
...

Is it possible to use WIX even remotely simple like this?

Did you find a way of doing this? I am looking for the same result

Yes, I used IFRAME. Also custom embeded HTML should work. :-/

This seems silly to me that I have to embedd a form in an Iframe in order for me to get a webhook sent to Zapier/Integromat etc…
I cant believe its almost 2020 and there is no simple way of doing this…

You can use the wix-fetch API . See the article Corvid: Accessing Third-Party Services with the Fetch API to learn how to interface with an external endpoint.

See the Advanced examples for examples accessing external APIs.

@yisrael-wix I went through that documentation, you are completely missing the point here. I am not looking to fetch anything, I want Wix to push contents of a form submission to an endpoint. Why would I have to use an api or fetch anything?.. you are already posting this information somewhere… why is it such a big deal to add a webhook option?
I understand I can do it through this API but why would I spend hours writing code for a simple function?

@eyal26259 The fetch() function provides an interface for fetching an API resource. This could be for a GET to receive something from the API endpoint, or (in your case) PUT to send something to the API endpoint.

I would suggest looking at the following examples:

Expose and Access Site APIs

Use MyApi and MyApiClient to expose and access external APIs.

Send Email with SendGrid REST Interface

Send an email using the SendGrid REST API.

Stripe Payment Processing

Integrate the Stripe Payment processing system into a site. Three levels of user access are demonstrated: visitor, freemium (registered), and premium (paid).

I found a website that makes complicated html forms in an iframe format, which also provides the option to send the info via a json (webhook). The free plan is MORE than enough. The free plan even lets you take payment… but you’re only allowed one form.

Cognito Forms.

Like I mentioned earlier, I can easily embed an Iframe, but why would I ? Because the Wix developers refuse to add such a simple and helpful function?

@yisrael-wix I completely understand the documentation. I also know how to use Sendgrid API regardless of Wix or any other API for that matter but this is still not what im talking about.
I should not have to write even one single line of code in order to get a webhook from a Wix form and refuse to do so because you refuse to add this functionality out of the box.

@yisrael-wix @eyal26259

The point being made is, if people knew code to the extent that you are suggesting we know code, we wouldn’t be going to Wix in the first place. We may understand certain aspects of web code, but we are looking for a “Send” button that has a predefined option to send the data connected to it via a webhook to a third party.

I for one do not want to try and understand Wix Code. I don’t have the time to simply understand, nor do I feel like I need to. This is why I go to Wix: to simplify this for me so I don’t need to learn.

Im not looking to be taught how to code!

@eyal26259 I think they already have connected a custom form submission to zapier via their “automations” section but that sometimes does not give complete information or is buggy for me at least.

I had the same problem myself for a long time and trawled through the forums and documentation, but was not the greatest help. I simply just had to put in time myself to make as simple code as possible to submit webhook on submissions.

@contact80783 couldn’t agree more!

@eyal26259 It’s not that Wix “refuses” to add this functionality, it’s more a matter of priorities and needs of the moment. The wix-fetch API exists to allow maximum flexibility and to provide an answer for just about any external API.

You might be able to use Wix Automations . See Creating an Automation for a Wix Data Form Submission for information.

Regarding Webhooks, the Restaurants app already has such a feature: Using a Webhook to Integrate Wix Restaurants with Third-Party Services . I imagine that other Wix APIs will eventually implement Webhooks.

Corvid is constantly being improved, with new features being added regularly. Feel fee to suggest your own features .

@jaoshsethna yeah the Zapier integration is quite buggy, I am flustered by the response I got from the Wix team…
I will not be willing to write code for this since its something Wix can patch up, if they only choose to do so.

@jaoshsethna @eyal26259 We are not aware of any bugs with Automations and Zapier Integrations. Please describe the bugs that you are encountering so that they can be investigated and fixed.

This is one of many reasons (frontend performance, overcomplexity, …) why I prefer Webflow over WIX.

So after a year has passed, I should mention I had nothing but an awesome experience with the Wix team and once we had a conversation it was clear to me that they really want to provide solutions as oppose to what I initially thought.
In order to make this work you will need to do a few things:

  1. Dont use a form element but create the fields and submit button manually.
  2. Connect each and every field to a dataset.
  3. Add some custom backend code (I made a template you could reuse with the help of the wix team) - [https://github.com/eyalway2cu/eyal_scripts/blob/master/wix/formWebhook.js](https://github.com/eyalway2cu/eyal_scripts/blob/master/wix/formWebhook.js

You)

Thank you very much for posting your solution. This is exactly what I was looking for !

However, I noticed some small details (quotation marks, afterInsert → afterSave) preventing the code from working on my wix page. I therefore proposed some corrections on your published code on github if you don’t mind.

Since I’m pretty much a newbie regarding wix code I would have found some additional information on how to program everything very useful:

  1. Create form elements and submit button manually.

  2. Connect the form elements and button to the dataset

  3. Copy the code from below and insert it to the page code on the wix site.

  4. Change “YOURWEBHOOK” with webhook-url from Integromat-Webhooksmodule

  5. Change “dataset1” name to the name of the dataset on the wix page.

Here is the code that worked on my wix page:

import {fetch} from 'wix-fetch';

function sendData(item) {    
//replace YOURWEBHOOKADDRESS with a webhook address (i.e https://somewebsite.com) 
    fetch("YOURWEBHOOK", {
            method: 'post', headers: {'Content-Type': "application/json"}, body: JSON.stringify(item)})
        .then((httpResponse) => {
 if (httpResponse.ok) {
 return httpResponse.json();
            } else {
 return Promise.reject("Fetch did not succeed");
            }
        })
        .then((json) => console.log(json))
        .catch(err => console.log(err));
}

//replace datasetname with your dataset name, if your dataset is called submissions then you change the function name to submissions_afterInsert
export function dataset1_afterSave(item, context) {
    sendData(item);
 return item
}