93 lines
3.7 KiB
JavaScript
93 lines
3.7 KiB
JavaScript
document.addEventListener("DOMContentLoaded", function () {
|
|
const saveButton = document.querySelector(".modal-footer .btn-primary");
|
|
const modalButton = document.querySelector(".btn-modal");
|
|
const form = document.querySelector("form#create-update-form");
|
|
|
|
if (!saveButton || !form) return;
|
|
|
|
saveButton.addEventListener("click", function () {
|
|
// Disable tombol dan tampilkan spinner
|
|
modalButton.disabled = true;
|
|
modalButton.innerHTML = `
|
|
<span class="spinner-border spinner-border-sm me-1" role="status" aria-hidden="true"></span>
|
|
Loading...
|
|
`;
|
|
const isEdit = saveButton.classList.contains("btn-edit");
|
|
const formData = new FormData(form)
|
|
const toast = document.getElementById('toastEditUpdate');
|
|
const toastBody = toast.querySelector('.toast-body');
|
|
const toastHeader = toast.querySelector('.toast-header small');
|
|
|
|
const data = {};
|
|
|
|
// Mengonversi FormData ke dalam JSON
|
|
formData.forEach((value, key) => {
|
|
data[key] = value;
|
|
});
|
|
|
|
// Log semua data dalam FormData
|
|
for (let pair of formData.entries()) {
|
|
console.log(pair[0] + ": " + pair[1]);
|
|
}
|
|
const url = form.getAttribute("action");
|
|
console.log("Ini adalah url dari form action", url);
|
|
|
|
const method = isEdit ? "PUT" : "POST";
|
|
|
|
fetch(url, {
|
|
method: method,
|
|
body: JSON.stringify(data),
|
|
headers: {
|
|
Authorization: `Bearer ${document
|
|
.querySelector('meta[name="api-token"]')
|
|
.getAttribute("content")}`,
|
|
"Content-Type": "application/json",
|
|
}
|
|
})
|
|
.then(response => response.json())
|
|
.then(data => {
|
|
console.log("Response data:", data);
|
|
if (!data.errors) {
|
|
// Set success message for the toast
|
|
toastBody.textContent = isEdit ? "Data updated successfully!" : "Data created successfully!";
|
|
toastHeader.textContent = "Just now";
|
|
toast.classList.add('show'); // Show the toast
|
|
setTimeout(() => {
|
|
toast.classList.remove('show'); // Hide the toast after 3 seconds
|
|
}, 3000);
|
|
|
|
setTimeout(() => {
|
|
window.location.reload();
|
|
}, 3000);
|
|
} else {
|
|
// Set error message for the toast
|
|
toastBody.textContent = "Error: " + (responseData.message || "Something went wrong");
|
|
toastHeader.textContent = "Error occurred";
|
|
toast.classList.add('show'); // Show the toast
|
|
|
|
// Enable button and reset its text on error
|
|
modalButton.disabled = false;
|
|
modalButton.innerHTML = isEdit ? "Update" : "Create";
|
|
|
|
setTimeout(() => {
|
|
toast.classList.remove('show'); // Hide the toast after 3 seconds
|
|
}, 3000);
|
|
}
|
|
})
|
|
.catch(error => {
|
|
console.error("Error:", error);
|
|
// Set error message for the toast
|
|
toastBody.textContent = "An error occurred while processing your request.";
|
|
toastHeader.textContent = "Error occurred";
|
|
toast.classList.add('show'); // Show the toast
|
|
|
|
// Enable button and reset its text on error
|
|
modalButton.disabled = false;
|
|
modalButton.innerHTML = isEdit ? "Update" : "Create";
|
|
|
|
setTimeout(() => {
|
|
toast.classList.remove('show'); // Hide the toast after 3 seconds
|
|
}, 3000);
|
|
});
|
|
});
|
|
}); |