Contact form JS file

[ukonuidika]

(1) Firstly I have created a JS file for the contact form.

(2) I also created a html file for this purpose as well.

(3) I also created a php file to help send the mail to the saver.

Below is my JS for Contact form.

document.addEventListener( "DOMContentLoaded", function () { var contactForm = document.getElementById ("contact-form"); var formMessages = document.getElementById ("form-messages"); contactForm.addEventListener("submit", function (event){ event.preventDefault(); var formData = new formData(contactForm); fetch("contact.php",{ method: "POST", body: formData })

        .then(function(response) {
            return response.json();
        })

        .then(function(data) {
            formMessages.textContent = data.message;
            formMessages.style.display = "block";
            if (data.success) {
                formMessages.style.color = "green";
                contactForm.reset();
            }
            else {
                formMessages.style.color = "red";
            }
        })

        .catch(function(error) {
            console.error("Error", error);
        });

    });

});

[netlify[bot]]

✅ Deploy Preview for snazzy-moonbeam-86e465 ready!

Name	Link
🔨 Latest commit	dca7602d6d746f9f78a1a37da5733cff7a0ca621
🔍 Latest deploy log	https://app.netlify.com/sites/snazzy-moonbeam-86e465/deploys/661c3ce853a3190008775ea4
😎 Deploy Preview	https://deploy-preview-487--snazzy-moonbeam-86e465.netlify.app
📱 Preview on mobile	Toggle QR Code... Use your smartphone camera to open QR code link.

---

To edit notification comments on pull requests, go to your Netlify site configuration.

[netlify[bot]]

✅ Deploy Preview for dazzling-melomakarona-fe8d9f ready!

Name	Link
🔨 Latest commit	dca7602d6d746f9f78a1a37da5733cff7a0ca621
🔍 Latest deploy log	https://app.netlify.com/sites/dazzling-melomakarona-fe8d9f/deploys/661c3ce8db18890008c3030d
😎 Deploy Preview	https://deploy-preview-487--dazzling-melomakarona-fe8d9f.netlify.app
📱 Preview on mobile	Toggle QR Code... Use your smartphone camera to open QR code link.

---

To edit notification comments on pull requests, go to your Netlify site configuration.