-
Notifications
You must be signed in to change notification settings - Fork 0
/
script.js
71 lines (61 loc) · 1.79 KB
/
script.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
66
67
68
69
70
71
const add_todo = () => {
let title = document.getElementById("todo_title").value;
let descp = document.getElementById("dscp").value;
if (title.trim() === "" || descp.trim() === "") {
return; // Exit the function if title or description is empty
}
let todos = [];
let localTodos = localStorage.getItem("todos");
if (localTodos != null) {
try {
todos = JSON.parse(localTodos);
} catch (error) {
console.error("Error parsing todos from localStorage:", error);
}
}
let todoObject = {
title: title,
descp: descp,
id: Math.trunc(Math.random() * 1000),
};
todos.push(todoObject);
try {
localStorage.setItem("todos", JSON.stringify(todos));
show_todo();
} catch (error) {
console.error("Error storing todos in localStorage:", error);
}
};
// Show the data:
const show_todo = () => {
let todoString = localStorage.getItem("todos");
let content = "";
if (todoString == null) {
content += "<h3 style='color: white'>NO TODO TO SHOW</h3>";
} else {
let todos = JSON.parse(todoString);
for (let todo of todos) {
content += `
<div class = 'card' id="card-${todo.id}">
<div class = 'card_body'>
<h3>${todo.title}</h3>
<p>${todo.descp}</p>
<button class="delete_btn" onclick="deleteTodo(${todo.id})">Delete</button>
</div>
</div>`;
}
}
document.getElementById("main_content").innerHTML = content;
};
show_todo();
function deleteTodo(todoId) {
// Remove the todo from the localStorage
let todos = JSON.parse(localStorage.getItem("todos"));
todos = todos.filter((todo) => todo.id !== todoId);
localStorage.setItem("todos", JSON.stringify(todos));
// Remove the todo card from the DOM
let card = document.getElementById(`card-${todoId}`);
if (card) {
card.remove();
}
}