This is a simple code snippet for a ToDo-List application.
The function InputCheck() is designed to validate if the input bar contains any value. If the input bar is empty, the function should not trigger the addTodo function. However, in its current state, the function does not execute even when there is a value in the input field. I'm unable to identify the issue causing this behavior and no errors are being displayed. Any suggestions or insights would be greatly appreciated. Thank you!
const listButton = document.getElementById("ListButton");
const myList = document.getElementById("MyList");
const deleteButton = document.getElementById("Delete");
const doneButton = document.getElementById("Done");
listButton.addEventListener("click", InputCheck);
function InputCheck() {
var input = document.getElementById("textValue").value;
if (input == "") {
} else {
addTodo;
}
}
function addTodo(event) {
event.preventDefault();
const toDoDiv = document.createElement("div");
const newListItem = document.createElement("li");
newListItem.innerHTML = document.getElementById("textValue").value;
toDoDiv.appendChild(newListItem);
toDoDiv.classList.add("ToDo-Div");
const deleteBtn = document.createElement("button");
deleteBtn.classList.add("delete-btn");
deleteBtn.innerHTML = '<button id="Delete" class="button">Delete</button>';
toDoDiv.appendChild(deleteBtn);
const doneBtn = document.createElement("button");
doneBtn.classList.add("done-btn");
doneBtn.innerHTML = '<button id="Done" class="button1">Done</button>';
toDoDiv.appendChild(doneBtn);
myList.appendChild(toDoDiv);
}