0

Trying to create a flashcard app with cards made using user input and then saved into local storage so it can be accessed even after refreshing.

const newBtn = document.getElementById("newBtn")

function getWordList() {
  return JSON.parse(localStorage.getItem("wordList") || "\[\]")
}

function saveWord(list) {
  localStorage.setItem("wordList", JSON.stringify(list));
}

function addWord() {
  let list = getWordList();

  const newWord = {
    id       : document.getElementById("english").value,
    english  : document.getElementById("english").value,
    japanese : document.getElementById("japanese").value
  };

  list.push(newWord);

  saveWord(list);
}

document.addEventListener('DOMContentLoaded', ()=\>{
  newBtn.addEventListener("click", addWord);
});
  • User puts text in input field
  • Submit Button is Pressed
  • word list is accessed from local storage
  • inputs are used to create a new object
  • object is pushed into the word list
  • word list is then saved with the new object added

I feel like all of the pieces are there but i'm assembling it incorrectly.

Mister Jojo
  • 20,093
  • 6
  • 21
  • 40
Rizztek
  • 1
  • 1
    `()=\>{` is not valid syntax - check your browser console for errors - the fact that you feel the need to wait for DOMContentLoaded before adding the event listener suggests `newBtn` will be undefined – Jaromanda X Dec 07 '22 at 03:04
  • `"\[\]"` isn't valid JSON either. Did you mean `"[]"`. Apologies if this is just nonsense that the [stupid _Ask Wizard_ has inserted into your code](https://meta.stackoverflow.com/q/416802/283366) – Phil Dec 07 '22 at 03:20
  • Other than syntax errors that probably don't exist in your actual code, I'm guessing there's an error in your console like _"newBtn is null"_. Move your very first line into the `DOMContentLoaded` event handler – Phil Dec 07 '22 at 03:27

0 Answers0