Get form’s value

let grocery = document.getElementById('grocery-form');

grocery.addEventListener('submit', (e) => {
  addItem(e);
});

function addItem(e) {
  e.preventDefault();
  let data = document.getElementById('writeList').value;
  console.log(data);
}

HTML

<form id="grocery-form" class="form">
  <div class="form-input">
    <input
      type="text"
      class="form-control"
      id="writeList"
      aria-describedby="Write grocery item"
      placeholder="Add new item"
      required
    />
    <button type="submit" class="btn btn-warning">Submit</button>
  </div>
</form>
Was this page helpful?