Learn localStorage by Building a Todo App - Step 23

Tell us what’s happening:

I have set tasksContainer.innerHTML += ``; as required by the step, but it will not pass.

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);
}
//HERE IS THE CODE
taskData.forEach(({id, title, date, description}) => {
tasksContainer.innerHMTL += ``;

});

});

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

/* file: styles.css */

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

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

  });


// User Editable Region

Your browser information:

User Agent is: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/126.0.0.0 Safari/537.36

Challenge Information:

Learn localStorage by Building a Todo App - Step 23

Hi there!
Your code is correct. Reset the challenge step and try again.

Hi! I tried and it still fails. So strange.

try the code on different borwser.

I tried it on SAFARI and it worked LOL. Why is that? It didn’t work on either Chrome. Is there a way to fix that?

you had .innerHMTL not .innerHTML

1 Like