-
Notifications
You must be signed in to change notification settings - Fork 0
/
todoscript.js
65 lines (55 loc) · 2.01 KB
/
todoscript.js
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
document.addEventListener("DOMContentLoaded", () => {
const taskInput = document.getElementById("task-input");
const addButton = document.getElementById("add-button");
const taskList = document.getElementById("task-list");
//to add a new task
const addTask = () => {
const taskText = taskInput.value.trim();
if (taskText === "") {
alert("Please enter a task.");
return;
}
const li = document.createElement("li");
li.innerHTML = `
${taskText}
<div class="task-buttons">
<button class="edit-button">Edit</button>
<button class="delete-button">Delete</button>
</div>
`;
taskList.appendChild(li);
taskInput.value = "";
//event listeners to new buttons
li.querySelector(".edit-button").addEventListener("click", editTask);
li.querySelector(".delete-button").addEventListener("click", deleteTask);
};
//to edit a task
const editTask = (event) => {
const li = event.target.closest("li");
const taskText = li.firstChild.textContent.trim();
const newTaskText = prompt("Edit your task:", taskText);
if (newTaskText !== null && newTaskText.trim() !== "") {
li.firstChild.textContent = newTaskText.trim();
}
};
//to delte task
const deleteTask = (event) => {
const li = event.target.closest("li");
li.remove();
};
// Add task
addButton.addEventListener("click", addTask);
// Add task when the Enter key is pressed in the input field
taskInput.addEventListener("keypress", (event) => {
if (event.key === "Enter") {
addTask();
}
});
// Add event listeners
document.querySelectorAll(".edit-button").forEach(button => {
button.addEventListener("click", editTask);
});
document.querySelectorAll(".delete-button").forEach(button => {
button.addEventListener("click", deleteTask);
});
});