eclipse
1887cc406b
- enter key - escape key - click close button - click submit button - click cancel button - click outside of modal note: right now the corrections only affect genre.html; changes will need to be carried over to other templates
39 lines
1.8 KiB
JavaScript
39 lines
1.8 KiB
JavaScript
/*
|
|
* MODAL FUNCTIONS
|
|
*/
|
|
// adds event handlers that raise a modal
|
|
function initModal(modal_id, input_ids, headings, form_actions) {
|
|
// if input_ids is not an array, make it a single-element array
|
|
input_ids = Array.isArray(input_ids) ? input_ids : [ input_ids ];
|
|
// add event listener to "New" element
|
|
document.getElementById("create-button").addEventListener("click", () => showDialog(modal_id, input_ids, headings[0], form_actions[0], new Array(input_ids.length).fill(""), 0));
|
|
// add event listeners to "update" elements
|
|
for (const el of document.querySelectorAll('.action-update')) {
|
|
el.addEventListener("click", event => showDialog(modal_id, input_ids, headings[1], form_actions[1], input_ids.map(input => event.currentTarget.dataset[input.slice(5).toLowerCase()]), event.currentTarget.dataset.id));
|
|
}
|
|
/* // add event listener to close button
|
|
document.querySelector("dialog button.modal-close").addEventListener("click", event => {
|
|
event.target.closest("dialog").close();
|
|
event.preventDefault();
|
|
}); */
|
|
}
|
|
|
|
|
|
// raises a modal with the given options
|
|
function showDialog(modal_id, input_ids, heading, form_action, input_values, url_id) {
|
|
// if form action includes the string "update", the id at the end of the URL is a dummy and must be replaced with the correct id
|
|
if ( form_action.includes("update") && url_id) {
|
|
form_action = form_action.slice(0, form_action.lastIndexOf("/") + 1) + url_id;
|
|
}
|
|
// set modal attributes
|
|
document.getElementById("dialog-heading").textContent = heading;
|
|
document.getElementById("form_submit").formAction = form_action;
|
|
document.getElementById("form_submit").form.action = form_action;
|
|
for (var i = 0; i < input_ids.length; i++ ) {
|
|
document.getElementById(input_ids[i]).value = input_values[i] || "";
|
|
}
|
|
// raise modal
|
|
document.getElementById(modal_id).showModal();
|
|
}
|
|
|