Good day! I need to have 2 different models to create projects and todo lists. I’ve figured out, that for html there is only one dialog menu that can be invoked with window.dialog.showModal();
directly. So then, I’ve created dialogModule file to store dialog model code for project pop-up model. Here is the code inside this module:
export const dialog = document.getElementById("project-dialog");
export const open = document.getElementById("open");
export const cancel = document.getElementById("cancel");
export const close = document.getElementById("close");
export let openModel = open.addEventListener("click", () => {
dialog.showModal();
});
export let cancelModel = cancel.addEventListener("click", () => {
dialog.close();
});
export let closeMondel = close.addEventListener("click", () => {
dialog.close();
});
And when I want to invoke project model menu, nothing happens.
Function that supposes invoking model:
import { dialog, open, openModel } from "./dialogModule";
function updateProjectItems(e) {
openModel;
const div = e.parentElement.parentElement.querySelector("div");
projectValue.value = div.innerText;
updateText = e.parentElement.parentElement.querySelector("div");
addProjectUpdate.setAttribute("onclick", "UpdateOnSelectionProjects()");
projectValue.focus();
}
With updating todo list it has window.dialog.showModal();
:
function UpdateToDoItems(e) {
if (
e.parentElement.parentElement.querySelector("div").style.textDecoration ===
""
) {
window.dialog.showModal();
const values = e.parentElement.parentElement.querySelectorAll("#values");
todoValue.value = values[0].innerText;
todoDescription.value = values[1].innerText;
todoDate.value = values[2].innerText;
todoPriority.value = values[3].innerText;
updateText = e.parentElement.parentElement.querySelectorAll("#values");
addUpdate.setAttribute("onclick", "UpdateOnSelectionItems()");
todoValue.focus();
}
}
I use variable for projects to summon a pop-up menu, which is not working. What can I do to fix it?
Here is my full repo: github repo