60 lines
2.1 KiB
JavaScript
60 lines
2.1 KiB
JavaScript
document.addEventListener('DOMContentLoaded', function() {
|
|
const bookingForm = document.getElementById('bookingForm');
|
|
|
|
if (bookingForm) {
|
|
bookingForm.addEventListener('submit', function(e) {
|
|
e.preventDefault();
|
|
|
|
const submitBtn = bookingForm.querySelector('button[type="submit"]');
|
|
const originalBtnText = submitBtn.innerText;
|
|
submitBtn.disabled = true;
|
|
submitBtn.innerText = 'Sending...';
|
|
|
|
const formData = new FormData(bookingForm);
|
|
|
|
fetch('/api_book.php', {
|
|
method: 'POST',
|
|
body: formData
|
|
})
|
|
.then(response => response.json())
|
|
.then(data => {
|
|
if (data.success) {
|
|
showToast('Request sent successfully! We will contact you soon.', 'success');
|
|
bookingForm.reset();
|
|
} else {
|
|
showToast(data.error || 'Something went wrong. Please try again.', 'danger');
|
|
}
|
|
})
|
|
.catch(error => {
|
|
showToast('Network error. Please check your connection.', 'danger');
|
|
})
|
|
.finally(() => {
|
|
submitBtn.disabled = false;
|
|
submitBtn.innerText = originalBtnText;
|
|
});
|
|
});
|
|
}
|
|
});
|
|
|
|
function showToast(message, type = 'success') {
|
|
const toastContainer = document.getElementById('toastPlacement');
|
|
if (!toastContainer) return;
|
|
|
|
const toastHtml = `
|
|
<div class="toast align-items-center text-white bg-${type} border-0 show" role="alert" aria-live="assertive" aria-atomic="true">
|
|
<div class="d-flex">
|
|
<div class="toast-body">${message}</div>
|
|
<button type="button" class="btn-close btn-close-white me-2 m-auto" data-bs-dismiss="toast" aria-label="Close"></button>
|
|
</div>
|
|
</div>
|
|
`;
|
|
|
|
const toastElement = document.createElement('div');
|
|
toastElement.innerHTML = toastHtml;
|
|
toastContainer.appendChild(toastElement);
|
|
|
|
setTimeout(() => {
|
|
toastElement.remove();
|
|
}, 5000);
|
|
}
|