Filtering doesn't work

[isa3bel]

Hello, I tried following along your video and couldn't get the filtering to work. I cloned your repo, and the filter didn't seem to work there either. Do you know why this would be the case? All the other features are working properly. Thanks

[JJacoBB13]

I have this same problem. I'm following your video and couldn't find what I'm doing wrong.

[bbolshinsky]

Hi, what worked for me was a slight change to the "app.js" file. Specifically, the section containing "Event Listeners".

Old code: filterOption.addEventListener("click", filterTodo);
New code: filterOption.addEventListener("change", filterTodo);

i.e. Replace "click" with "change". Hopefully, that will solve the issue.

[KafkaIsK]

Hey, has this been solved? My problem is that it can't filter because of "Uncaught TypeError: Cannot read property 'contains' of undefined" or "Uncaught TypeError: Cannot set property 'display' of undefined". When I console.log(todo), I am able to see the divs but I still don't know when looping in the foreach why its undefined. Help will be greatly appreciated. Thanks

[allaboutchris2020]

Hey, has this been solved? My problem is that it can't filter because of "Uncaught TypeError: Cannot read property 'contains' of undefined" or "Uncaught TypeError: Cannot set property 'display' of undefined". When I console.log(todo), I am able to see the divs but I still don't know when looping in the foreach why its undefined. Help will be greatly appreciated. Thanks

Instead of writing e.target.value write e.target.nodeValue. The error will not be there, but still filtering doesn't work.

[KafkaIsK]

Hey, thanks for the help. Since my initial comment, I have found a solution that doesn't bring up any errors and filtering does work.

Wrapping the switch statement within this if statement solves the issue for me:

const mStyle = todo.style;

if (mStyle != undefined && mStyle != null) { //switch statment here! }

This catches if todo.style is undefined so no more TypeError.

[qwerty084]

Hi, what worked for me was a slight change to the "app.js" file. Specifically, the section containing "Event Listeners".

Old code: filterOption.addEventListener("click", filterTodo); New code: filterOption.addEventListener("change", filterTodo);

i.e. Replace "click" with "change". Hopefully, that will solve the issue.

For me it didnt worked on mobile (it only filtered once i clicked the select menu again), desktop was fine. Since i added "change" as suggested it works perfectly. Thanks :)

[miroslavsavel]

Hey, thanks for the help. Since my initial comment, I have found a solution that doesn't bring up any errors and filtering does work.

Wrapping the switch statement within this if statement solves the issue for me:

const mStyle = todo.style;

if (mStyle != undefined && mStyle != null) { //switch statment here! }

This catches if todo.style is undefined so no more TypeError.

Thank you, this has solved the issue for me with "Uncaught TypeError: todo.classList is undefined"

[miroslavsavel]

Also here is the discussion about this error https://stackoverflow.com/questions/61541582/element-style-and-element-classlist-is-undefined

[Pamguicha]

Hey, thanks for the help. Since my initial comment, I have found a solution that doesn't bring up any errors and filtering does work.

Wrapping the switch statement within this if statement solves the issue for me:

const mStyle = todo.style;

if (mStyle != undefined && mStyle != null) { //switch statment here! }

This catches if todo.style is undefined so no more TypeError.

Thank you! I was stuck with this part and this really help me to move forwards