Please I need help displaying only search contact cards on my address book app

Okay. Did you check the code yet?

  1. I would suggest making each contact an object, so you have an array of objects.

  2. Use array methods instead of for loop, they let you be much more declarative about what data you are accessing (contactList => contact => contact.firstName).

  3. For the list filtering there are a lot of ways of doing it. One is to make a filtered version of the contact array and pass that to the render method (i.e. displayContactCard).

Here is a quick refactor example
https://codepen.io/lasjorg/pen/gOMNaEe

As an extra suggestion, use localStorage to save the list.

Okay, thanks a lot. Appreciate your help.

I just went through the refactored code by you, it cleared a lot of my confusion.

Thanks so much for taking a look at it, fixing it and also for your suggestions.

I guess I need to learn more of data structure.

No problem, if you have any questions just ask.

1 Like

I will for sure :slight_smile:

You’ve been a great help!

I actually got around to trying something similar in react. I believe I have the functionality you are looking for. You would only need to modify looking up object or array to be an array instead of a single value. You can check out the code on my github here. Let me know if you have any questions.