title: Store multiple form input values in local storage in JavaScript in the form of an array
body: <p>I am trying to save input values submitted through form into local storage in the form of the array, but once the form is submitted again, the saved value in local storage gets changed with the new submitted value as the</p>
  <pre><code>function bookDetails(bookName,bookAuthor,bookType) {
      this.name = bookName;
      this.author = bookAuthor;
      this.type = bookType;
  }
  
  let libraryForm = document.getElementById(&quot;bookForm&quot;);
  libraryForm.addEventListener(&quot;submit&quot;, libraryBooksDetails);
  
  function libraryBooksDetails(e,index) {
      
      e.preventDefault();
      console.log(&quot;The book details have been submitted&quot;);
      let bookName = document.getElementById(&quot;bookName&quot;).value;
      let bookAuthor = document.getElementById(&quot;author&quot;).value;
      let bookType;
      let fiction = document.getElementById(&quot;Fiction&quot;); 
      let programming = document.getElementById(&quot;ComputerProgramming&quot;);
      let personal = document.getElementById(&quot;PersonalDevelopement&quot;);
      
      if(fiction.checked){
          bookType = fiction.value;
      }
      else if(programming.checked){
          bookType = programming.value;
      }
      else if(personal.checked){
          bookType = personal.value;
      }
  // BookDetails Object
      let book = new bookDetails(bookName,bookAuthor,bookType);
      
      let bookData = &quot;&quot;
      bookData = bookData || [];
      let nameOfBooks = bookData.concat(bookName)
      // let nameOfBooks = bookData
      // nameOfBooks.push(book.bookName);
      localStore.setItem(&quot;books&quot;,JSON.stringify(nameOfBooks))
      console.log(book);
  
      let display = new Display()
      display.add(book);
      display.clear();
  }
  </code></pre>
  <p>Thanks</p>