Untitled
unknown
plain_text
10 months ago
2.9 kB
5
Indexable
function solve() {
const emailInput = document.getElementById("email");
const eventInput = document.getElementById("event");
const locationInput = document.getElementById("location");
const nextButton = document.getElementById("next-btn");
const previewList = document.getElementById("preview-list");
const eventList = document.getElementById("event-list");
// Validation for missing DOM elements
if (!emailInput || !eventInput || !locationInput || !nextButton || !previewList || !eventList) {
console.error("One or more required elements are missing from the DOM.");
return;
}
// Button Actions
const buttonActions = {
edit(event) {
const main = event.target.closest("li");
const [email, evt, loc] = Array.from(main.querySelectorAll("p")).map((el) =>
el.textContent.split(": ")[1]
);
emailInput.value = email;
eventInput.value = evt;
locationInput.value = loc;
previewList.removeChild(main);
nextButton.disabled = false;
},
apply(event) {
const main = event.target.closest("li");
main.querySelectorAll("button").forEach((btn) => btn.remove());
eventList.appendChild(main);
nextButton.disabled = false;
},
};
// Add to Preview List
nextButton.addEventListener("click", () => {
const email = emailInput.value.trim();
const event = eventInput.value.trim();
const location = locationInput.value.trim();
if (!email || !event || !location) {
console.warn("Invalid input values.");
return;
}
const li = document.createElement("li");
li.className = "application";
const article = document.createElement("article");
article.innerHTML = `
<p>Email: ${email}</p>
<p>Event: ${event}</p>
<p>Location: ${location}</p>
`;
li.appendChild(article);
["Edit", "Apply"].forEach((action) => {
const button = document.createElement("button");
button.textContent = action;
button.className = "action-btn";
button.addEventListener("click", buttonActions[action.toLowerCase()]);
li.appendChild(button);
});
previewList.appendChild(li);
emailInput.value = "";
eventInput.value = "";
locationInput.value = "";
nextButton.disabled = true;
});
// Enable/Disable "Next" Button Dynamically
[emailInput, eventInput, locationInput].forEach((input) => {
input.addEventListener("input", () => {
nextButton.disabled = !(
emailInput.value.trim() &&
eventInput.value.trim() &&
locationInput.value.trim()
);
});
});
}
Editor is loading...
Leave a Comment