Creating a Webhooks Button to launch a Scenario

[Stanislas_Berteloot]

Hello

I am looking for a way to submit text and to run a Scenario after each submission

Google Forms or Slack could be the way. It seems that only enterprise level is needed for Slack app. So Google Form might be the way to go.

I have see a tutorial on how to create run a scenario from a custom button on a Google form but I didn’t get it to work.

Also I don’t know how to link this webhook to a form submission.

Ideally having an instant execution once a form is submitted would be the best…

Any ideas would be welcomed.

Stan

[Bilal_Mansouri]

Hi Stan,

It sounds like you want to trigger a scenario execution whenever a form is submitted, and you’re considering using Google Forms

I’ll walk you through the process of setting up a Google Form that triggers a webhook whenever a user submits the form. We’ll use Google Apps Script to retrieve the form responses and send the submitted data to a specified webhook URL.

Step 1: Create a Google Form

1. Go to Google Forms (https://forms.google.com/) and create a new form.
2. Add fields for name and email, and any other fields you require.
3. Customize the form as needed (title, description, theme, etc.).

Step 2: Create a Google Apps Script

1. Open your Google Form.
2. Click on the “More” menu (three dots) in the top-right corner and select “Script editor.”

3. In the script editor, delete any existing code and replace it with the following:

function onFormSubmit(e) {
  var form = FormApp.getActiveForm();
  var formResponses = form.getResponses();
  var latestResponse = formResponses[formResponses.length - 1];
  var itemResponses = latestResponse.getItemResponses();
  
  // Extract the submitted name and email from the form response
  var submittedName = itemResponses[0].getResponse();
  var submittedEmail = itemResponses[1].getResponse();
  
  // Webhook URL
  var webhookUrl = "add-your-make-webhook-here";
  
  // Payload data
  var payload = {
    "name": submittedName,
    "email": submittedEmail
  };
  
  // Send the webhook request
  var options = {
    "method": "POST",
    "contentType": "application/json",
    "payload": JSON.stringify(payload)
  };
  
  UrlFetchApp.fetch(webhookUrl, options);
}

4. Replace the webhookUrl variable with your actual webhook URL.
5. Save the script by clicking on the “Save” button

Step 3: Set up a Trigger

1. In the script editor, click on the “Triggers” button (clock icon) in the left sidebar.

2. Click on the “Add Trigger” button in the bottom-right corner.
   

   

3. Configure the trigger as follows:

• Choose which function to run: “onFormSubmit”
• Choose which deployment should run: “Head”
• Select event source: “From form”
• Select event type: "On form submit"

4. Click on the “Save” button to create the trigger.

Step 4: Test the Setup

1. Submit a response to your Google Form with a name and email.
2. Check your webhook endpoint to verify that it received the form submission data.

By following this step-by-step guide, you should now have a Google Form set up that triggers a webhook whenever a user submits the form.

The submitted name and email will be sent as a payload to the specified webhook URL. You can customize the form and the script to include additional fields and data as needed.

Hope that clears things up!

[Stanislas_Berteloot]

Wow, thank you so much!
I will try this in the morning and get back to you. It seems like this is exactly what I wanted to do.
So grateful for your taking the time to walk me through.
Thanks
Stan

[Mohammed_Breky]

if your form is simple, and you don’t want to get into googleforms, you can use an HTML page and host it on your server or any free hosting like github or 000webhost, ask Chat GPT to make you the HTML form with your required field and tell him to send the data to a webhook, then replace with your webhook url

worked for me before, and it gives you a more professional look if it’s for a client.

[Donald_Mitchell]

If you’re not tied to Google Forms, something like Fillout, Jotform, as well as others have great integrations with Make. There’s a whole module for “When form is submitted” so it’s super easy to get up and running.

[Stanislas_Berteloot]

Jotform is great and works perfectly.
Thanks!

[Stanislas_Berteloot]

First time I play with Github. Amazing thanks
I have a page with a simple form now. it works but only triggers when I click on run once.
I I live it live and set to immediately submitting a form doesn’t seem to trigger it.

here is the java script

document.getElementById(‘simpleForm’).addEventListener(‘submit’, function(event) {
event.preventDefault(); // This line prevents the default form submission

const formData = {
    message: document.getElementById('message').value
};

fetch('https://hook.us1.make.com/pa9a2atty29md7kd3y5byva159r1xkxh', {
    method: 'POST',
    headers: {
        'Content-Type': 'application/json',
    },
    body: JSON.stringify(formData)
})
.then(response => {
    if (!response.ok) {
        throw new Error('Network response was not ok');
    }
    return response.json();
})
.then(data => alert('Form submitted successfully!'))
.catch((error) => {
    console.error('Error:', error);
    alert('Failed to submit form');
});

});

[Stanislas_Berteloot]

I also still have to try this.

[Mohammed_Breky]

i think now you can use the google form module, it has the watch response trigger