<aside> ❤️ New to Webflow? Support the Channel by using my Webflow-Affiliate Link https://webflow.grsm.io/webtotheflow
</aside>
<aside> 🚀 New to Make.com? ****https://bit.ly/wttf-make
</aside>
<script>
// © Code by Marvin Aziz, <https://www.webtotheflow.com/>
// Copyright 2023, Marvin Aziz, All rights reserved.
// You have the license to use this code in your projects but not to redistribute it to others
// This code helps you respond to a feedbackform with a personal message using Make.com & OpenAI
document.addEventListener('DOMContentLoaded', function() {
// Find the form
var form = document.getElementById('email-form');
// Find the result heading
var resultHeading = document.getElementById('result-heading');
// Find the loading element (Lottie) and hide it initially
var loadingElement = document.getElementById('loading');
loadingElement.style.display = "none";
// Add an event listener to the form submit
form.addEventListener('submit', function(e) {
// Prevent default form submission
e.preventDefault();
// Get form values (adjust as needed)
var name = document.getElementById('name').value;
var email = document.getElementById('email').value;
var feedback = document.getElementById('Feedback').value;
// Hide the form and show the loading animation
form.style.display = "none";
loadingElement.style.display = "block";
// Update the result heading text
resultHeading.textContent = "Thank you " + name + "!";
// Define your data
var data = {
name: name,
email: email,
feedback: feedback
};
// Send a POST request to the webhook
fetch('<https://hook.eu1.make.com/YOUR-WEBHOOK-ID>', {
method: 'POST',
body: JSON.stringify(data),
headers: {
'Content-Type': 'application/json'
},
})
.then(function(response) {
// Parse the response as text
return response.text();
})
.then(function(body) {
// Display the response data
console.log(body)
var resultElement = document.getElementById('result');
if (resultElement) {
resultElement.textContent = body; // directly assign the response body to textContent
// Hide the loading animation
loadingElement.style.display = "none";
} else {
console.error('No element with id "result" found to display the response data');
}
})
.catch(function(error) {
console.error('Error:', error);
});
});
});
</script>