Learn localStorage by Building a Todo App - Step 17

Your code so far

const taskForm = document.getElementById("task-form");
const confirmCloseDialog = document.getElementById("confirm-close-dialog");
const openTaskFormBtn = document.getElementById("open-task-form-btn");
const closeTaskFormBtn = document.getElementById("close-task-form-btn");
const addOrUpdateTaskBtn = document.getElementById("add-or-update-task-btn");
const cancelBtn = document.getElementById("cancel-btn");
const discardBtn = document.getElementById("discard-btn");
const tasksContainer = document.getElementById("tasks-container");
const titleInput = document.getElementById("title-input");
const dateInput = document.getElementById("date-input");
const descriptionInput = document.getElementById("description-input");

const taskData = [];
let currentTask = {};

openTaskFormBtn.addEventListener("click", () =>
  taskForm.classList.toggle("hidden")
);

closeTaskFormBtn.addEventListener("click", () => {
  confirmCloseDialog.showModal();
});

cancelBtn.addEventListener("click", () => confirmCloseDialog.close());

discardBtn.addEventListener("click", () => {
  confirmCloseDialog.close();
  taskForm.classList.toggle("hidden");
});


taskForm.addEventListener("submit", (e) => {
  e.preventDefault();

  const dataArrIndex = taskData.findIndex((item) => item.id === currentTask.id);
  const taskObj = {
    id: `${titleInput.value.toLowerCase().split(" ").join("-")}-${Date.now()}`,
    title: titleInput.value,
    date: dateInput.value,
    description: descriptionInput.value,
  };

   if (dataArrIndex === -1) {
    taskData.unshift(taskObj);
  }

  taskData.forEach(({id, title, date, description}))  
  tasksContainer.innerHTML += () => ``;

I don’t know why I can’t pass step 17. I am creating an implicit return and using addition assignment to set the innerHTML of tasksContainer to empty backticks.

Your browser information:

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

Challenge Information:

Learn localStorage by Building a Todo App - Step 17

The function should be inside the forEach. It is a callback function. Then, inside the function body assign the values as asked.

someArray.forEach(({some, parameters}) => element.property += 'something')
2 Likes

Got it to work on my end. Thank you so much for the help!

2 Likes

{Inside the body} , you are missing the body! There’s no need to use another () .
Ex:
(Bla bla bla => {element.property += ’ '}) ;

This topic was automatically closed 182 days after the last reply. New replies are no longer allowed.