website/static/js/contact.js

46 lines
1.5 KiB
JavaScript
Raw Normal View History

2023-06-13 20:13:00 +02:00
async function handleFormspreeSubmit(event) {
event.preventDefault();
var form = document.getElementById("contact-form");
var data = new FormData(event.target);
fetch(event.target.action, {
method: form.method,
body: data,
headers: {
Accept: "application/json",
},
})
.then((response) => {
if (response.ok) {
contactAlert("success", "Thanks for your submission!");
form.reset();
} else {
response.json().then((data) => {
var errMessage = data.errors;
for (var i = 0; i < errMessage.length; i++) {
contactAlert("danger", errMessage[i].message);
}
});
}
})
.catch((error) => {
contactAlert("danger", "Oops! There was a problem submitting your form");
});
}
function contactAlert(type, message) {
var contactFormStatus = document.getElementById("contact-form-status");
var alert = `<div class="alert alert-${type} d-flex align-items-center" role="alert">
<svg class="bi flex-shrink-0 me-2" role="img" aria-label="Success:">
<use xlink:href="#check-circle-fill" />
</svg>
<div>${message}</div>
<button type="button" class="btn-close" data-bs-dismiss="alert"></button>
</div>`;
contactFormStatus.innerHTML = alert;
// Remove alert after 3 seconds
setTimeout(function () {
contactFormStatus.innerHTML = "";
}, 3000);
}