Send form data to a webhook (e.g. Make)

General
,
1

I looked into the forum and tested for some hours but could not figure out a way to send form data to an external webhook (such as Make).

In the Forms section of the app, it only allows connection with email and Slack. And in the form element when I add the endpoint in the Action field, it does not receive anything. Only when I delete the connection with the form (i.e. delete the value in the Form field in the screenshot), the endpoint receives data but in this case there is no data validation and user gets a success message from Make which is not best user experience.

iScreen Shoter - Google Chrome - 240304210021

I read that there is connection with Make and Zapier in the roadmap, but is it possible to send the data in the webhook with another way?

2

Hey,

I created a tutorial on how you fetch Divhunt form in Make:

And in case you have a problem doing first part (connecting form to work in Divhunt), check this video:

In make video description you will find pastebin URL of JavaScript code that I used in video.

2 Likes
3

Been actually in need of tutorial, thank you :heart_eyes:

4

Amazing support one more time, exactly what I looking for! Thank you @Pakic :rocket:

1 Like
5

Hello,

Many thanks for the tutorial !
I have set it up on a test website, and try to fetch data into Pabbly (similar to Make), but I do not get fields / values, it seems the body is not passing through.

When I configure to receive webhook with headers, I correctly get the headers. I do not know what is wrong here (I have copied / pasted the code as you recommended in the video, and the console log is correctly showing the fields / values.

Could you help?

Here is my link to get a free account if needed: Pabbly

6

Hi folks,
in case you find out that the linked Pastebin code under the vid is for something else,
please feel free to take this snippet instead:

if (data.form.id === PASTE_YOUR_FORM_ID_HERE) {
  const formData = data.form.fields;
  fetch('https://hook.eu2.make.com/PASTE_YOUR_TOKEN_HERE', {
    method: 'POST',
    headers: {
      'Content-Type': 'application/json'
    },
    body: JSON.stringify(formData)
  })
    .then(response => {
      if (!response.ok) {
        throw new Error('Network response was not ok: ' + response.statusText);
      }
      // Check the content type to decide if we should parse it as JSON or text
      const contentType = response.headers.get('content-type');
      if (contentType && contentType.includes('application/json')) {
        return response.json();
      } else {
        return response.text();
      }
    })
    .then(data => {
      console.log('Success:', data);
    })
    .catch(error => {
      console.error('Error:', error);
    });
}
7

Were you able to get this to work? I’m thinking about buying Pabbly, but really wanted to see if it worked with Divhunt?
How do you like Pabbly, is it able to do flows to AI websites like Make does? I saw a tutorial for Make and found it very interesting.
thanks.

8

So far, I only managed to get the header response in Pabbly. For whatever reason, the body is not passing through. Maybe the body format should be formatted differently, I continue trying to find solution.

However, I managed to send data directly to my database (AiTable); in fact, I initially wanted to use Pabbly to send data there, but if I can do it directly with a script, I am fine too :slightly_smiling_face:

I hope I can soon find a way to send data to Pabbly because I am using it a lot, and I guess it is easier to send / manage data there than creating scripts everywhere in Divhunt.
When I find solution, I will post it as a reply in this post.

9

I have implemented the javascript exactly as indicated in the video; the form data is properly saved in Divhunt form submissions, but when I test by sending data to webhook.site, there is no form data received.
I made another test using Jotform to send replies to the same webhook, and it works perfect.
It seem the problem is in sending the data from Divhunt (https://step2you.divhunt.website/)
This means that even if I would use Make or any other tool, nothing would be received…

@Pakic: can you please help, I am stuck if I cannot send data outside Divhunt

Outcome with javascript in Divhunt:

image
image3239Ă—1501 427 KB

Outcome with Jotform:

image
image1920Ă—1176 113 KB

See the results here: Webhook.site - Test, transform and automate Web requests and emails

10

You might want to try the .js code I published some posts above in this thread.

It’s a slightly tweaked and proved (here make.com, plug in the right URL in line 3) version.
Best J

13

Same outcome when executing towards webhook.site (or Pabbly, or else), but I indeed get data when sending to make.

I will continue looking for solution to be able to send data to non-Make platforms

14

Does the console show CORS error?

I had that when I tried to connect different services via webhooks…

I started a thread about that I guess.

15

I have made more tests, with 4 scenarios:

  1. script towards webhook.site
  2. script towards Make
  3. script towards Pabbly
  4. script natively running inside Divhunt for forms.submission

image
image1576Ă—603 43.1 KB

I indeed get CORS error for webhook.site, but I do not get that for Make / Pabbly.

I managed to get it to work with following adjustments (@siniarch ):

  • in the script, instead of using a constant, just use data.form.fields in the stringify function:
if (data.form.id === 265) {
  fetch('https://connect.pabbly.com/workflow/sendwebhookdata/xxx', {
    method: 'POST',
    headers: {
      'Content-Type': 'application/json'
    },
    body: JSON.stringify(data.form.fields)
  })

=> See Pabbly lifetime deal here

2 Likes