Todo list issue, need a way to find the link between DOM elements and items in an array

[vital leaf]

Live: https://kweebac.github.io/todo-list/
Code: https://github.com/Kweebac/todo-list

Right now I've added a data-index attribute to all the "X" buttons div in each task div, and a data-index attribute to each **task div **itself. This is to keep track of their index in the tasks property array inside each newly created Project (which is only 1, the defaultProject for now). I want to get rid of the data-index attributes, and find another way to work out where they are in the tasks property array. How can I do this?

[rapid laurel]

generate a unique ID for each task. store all tasks in a "central" location. track them via ID everywhere you use them.

(note: I didn't look at your code at all)

[vital leaf]

Thanks lol

[rapid laurel]

if an ID doesn't work LMK and I'll try to dig through your code, but usually it's enough

[vital leaf]

By storing tasks in a central location, do you mean the DOM tasks or the actual task objects?

[rapid laurel]

Actual task objects.

[vital leaf]

class Project {
  constructor(name) {
    this.name = name;
    this.tasks = []; // task objects stored here
  }

  addTask(object) {
    this.tasks.push(object);
  }
  removeTask(event) { // event is the remove button in the task
    console.log(event.target.parentNode.id); // gets the ID of the task (task0, task1 etc)
  }
}```
So this is the code to remove the task from the tasks array. How do I delete the correct task from `this.tasks` using the `id` from the task in the DOM?

[rapid laurel]

each object in tasks already has an ID property of some sort? if so, use that wherever you're rendering tasks in the DOM. where are the IDs coming from that are used with event.target.parentNode.id?

[vital leaf]

Ohh, I thought you meant giving each DOM task an ID

[rapid laurel]

no

where you use data-index you should use the ID of the task from the tasks object. you can either use a data attribute or set the ID of the element itself to "task0", "task1", etc.

no idea where data-index is currently coming from, but arrays can be filtered or re-arranged making the index a bad ID.

[vital leaf]

I'll change this now, thanks for the help :)