HomeCSSjavascript - can we use loops in todo checklist additionally evaluate my...

javascript – can we use loops in todo checklist additionally evaluate my code

September 14, 2022

187

javascript – can we use loops in todo checklist additionally evaluate my code – Stack Overflow

Requested
in the present day

Seen
6 occasions

var todos = [];

var addTodoForm = doc.querySelector("#new-task-form");

var enter = doc.querySelector("#new-task-input").worth;

var listGroup = doc.querySelector("#duties");

addTodoForm.addEventListener('submit' , perform (occasion) {
    occasion.preventDefault();

    var todoValue = addTodoForm.todo.worth;

    const job = todoValue;
    if (job == 0) {
        alert("please enter in the present day duties");
        return;
    }

    todos.push({
        worth: todoValue,
    });

    addTodoForm.todo.worth = "";


    const task_el = doc.createElement("div");
        task_el.classList.add("job");

        const task_content_el = doc.createElement("div");
        task_content_el.classList.add("content material");

        task_el.appendChild(task_content_el);

        const task_input_el = doc.createElement("enter");
        task_input_el.classList.add("textual content");
        task_input_el.sort = "textual content";
        task_input_el.worth = job;
        task_input_el.setAttribute("readonly", "readonly")

        task_content_el.appendChild(task_input_el);

        const task_actions_el = doc.createElement("div");
        task_actions_el.classList.add("actions");

        const task_edit_el = doc.createElement("button");
        task_edit_el.classList.add("edit");
        task_edit_el.innerHTML = "Edit"

        const task_delete_el = doc.createElement("button");
        task_delete_el.classList.add("delete");
        task_delete_el.innerHTML = "Delete";

        task_actions_el.appendChild(task_edit_el);
        task_actions_el.appendChild(task_delete_el);

        task_el.appendChild(task_actions_el);

        listGroup.appendChild(task_el);
        

        task_edit_el.addEventListener('click on' , () =>{
            if ( task_edit_el.innerText.toLocaleLowerCase() == "edit") {
                task_input_el.removeAttribute("readonly");
                task_input_el.focus();
                task_edit_el.innerText = "Save";                
            }else{
                task_input_el.setAttribute("readonly" , "readonly");
                task_edit_el.innerText= "Edit";     
            }
        });

        task_delete_el.addEventListener('click on' , () =>{
            listGroup.removeChild(task_el);
        })
});