49 lines
1.7 KiB
JavaScript
49 lines
1.7 KiB
JavaScript
|
const studentModal = (idModal, callback) => {
|
||
|
|
const modalEl = document.getElementById(idModal);
|
||
|
|
// eslint-disable-next-line no-undef
|
||
|
|
const myModal = bootstrap.Modal.getOrCreateInstance(modalEl);
|
||
|
|
const studentForm = document.querySelector(`#${idModal} form`);
|
||
|
|
|
||
|
|
const setModalData = (element) => {
|
||
|
|
const inputs = studentForm.querySelectorAll("input[required]");
|
||
|
|
inputs.forEach((input) => {
|
||
|
|
const control = input;
|
||
|
|
control.value = element ? element[input.getAttribute("id")] : "";
|
||
|
|
});
|
||
|
|
const idInput = studentForm.querySelector("#id");
|
||
|
|
idInput.value = element ? element.id : "";
|
||
|
|
const groupSelector = studentForm.querySelector("select");
|
||
|
|
groupSelector.value = element ? element.group.id : "";
|
||
|
|
myModal.show();
|
||
|
|
};
|
||
|
|
|
||
|
|
modalEl.addEventListener("shown.bs.modal", (event) => {
|
||
|
|
if (!event.relatedTarget) {
|
||
|
|
return;
|
||
|
|
}
|
||
|
|
setModalData();
|
||
|
|
});
|
||
|
|
|
||
|
|
studentForm.addEventListener("submit", async (event) => {
|
||
|
|
event.preventDefault();
|
||
|
|
const data = {};
|
||
|
|
const inputs = studentForm.querySelectorAll("input[required]");
|
||
|
|
inputs.forEach((input) => {
|
||
|
|
data[input.getAttribute("id")] = input.value;
|
||
|
|
});
|
||
|
|
const idInput = studentForm.querySelector("#id");
|
||
|
|
const studentId = idInput.value;
|
||
|
|
const groupSelector = studentForm.querySelector("select");
|
||
|
|
data.groupId = groupSelector.value;
|
||
|
|
console.log(data);
|
||
|
|
myModal.hide();
|
||
|
|
if (callback) {
|
||
|
|
callback(studentId, data);
|
||
|
|
}
|
||
|
|
});
|
||
|
|
|
||
|
|
return { setData: (element) => setModalData(element) };
|
||
|
|
};
|
||
|
|
|
||
|
|
export default studentModal;
|