Build a Todo App using Local Storage - Step 36

JavaScript
1

Tell us what’s happening:

Why is #36 giving me so many problems? I moved the taskData.forEach( up to my new function.
Step 36
Use arrow syntax to create an updateTaskContainer function. Then move the taskData.forEach() and its content from the taskForm’s submit event listener into the newly created function.

Your code so far

<!-- file: index.html -->


/* file: styles.css */


/* file: script.js */
// User Editable Region

  const updateTaskContainer = () => {
    tasksContainer.innerHTML = "";
  
  taskData.forEach(
    ({ id, title, date, description }) => {
        (tasksContainer.innerHTML += `
        <div class="task" id="${id}">
          <p><strong>Title:</strong> ${title}</p>
          <p><strong>Date:</strong> ${date}</p>
          <p><strong>Description:</strong> ${description}</p>
          <button onclick="editTask(this)" type="button" class="btn">Edit</button>
          <button onclick="deleteTask(this)" type="button" class="btn">Delete</button> 
        </div>
      `)
    }
  );
};


// User Editable Region

Your browser information:

User Agent is: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/138.0.0.0 Safari/537.36 Edg/138.0.0.0

Challenge Information:

Build a Todo App using Local Storage - Step 36

2

Only do what is asked…nothing more.

1 Like
3

you made changes to the code instead of just moving it, you may want to reset the step and try again

1 Like