Eve Larson
Eve Larson

Reputation: 11

double click instead of single click ; reload()

I am coding a to-do list, and I want to delete the items added to the list from the screen and from the local storage. Here is the JS code:


function delete_btn() {
    let all_buttons = document.querySelectorAll(".remove_item");
    all_buttons.forEach((db, i) => {
        db.addEventListener('click', () => {
            del(i);
        })

        function del(i) {
            input_array.splice(i, 1);
            localStorage.setItem("items", JSON.stringify(input_array));
            console.log(localStorage);
            location.reload();

        }}
    )}

My first question: the items get deleted only on the second click and I cannot figure out what triggers the double click and how to change it to a single click?

My second question: in my code, the to-do list is located on the second section which is hidden when the page loads (I use "next" and "back" button to switch between the sections). When I run the above code to delete a to-do entry, the page gets reloaded to update the to-do list on the screen and goes back to the first section after the reload. How can I update the to-do list without reloading the page OR how can I reload the page to update the to-do list and stay on the second section (to-do section)? Thank you!

I found this solution Refresh Part of Page (div) for the reload using JQuery but I wonder if there is a plain JS solution?

Upvotes: 0

Views: 76

Answers (0)

Related Questions