Отправлятся пустые формы [закрыт]

(function() { 
  'use strict'; 
 
  var userData = [{ 
 
      name: 'Soaf', 
      quantity: '3', 
      price: '150', 
    }, 
    { 
      name: 'Cup', 
      quantity: '10', 
      price: '59', 
    }, 
    { 
      name: 'Chair', 
      quantity: '2', 
      price: '459', 
    }, 
    { 
      name: 'Table', 
      quantity: '2', 
      price: '19444', 
    }, 
    { 
      name: 'Bin', 
      quantity: '2', 
      price: '1843', 
    }, 
    { 
      name: 'Bear', 
      quantity: '8', 
      price: '3489', 
    }, 
    { 
      name: 'Phone', 
      quantity: '4', 
      price: '16843', 
    } 
 
  ]; 
  // Обновить таблицу в соответствии с данными 
  var updateTable = function() { 
    var dataTable = document.getElementById('table1'), 
      tableHead = document.getElementById('table-head'), 
      tbody = document.createElement('tbody'); 
 
    while (dataTable.firstChild) { 
      dataTable.removeChild(dataTable.firstChild); 
    } 
 
    dataTable.appendChild(tableHead); 
 
    for (var i = 0; i < userData.length; i++) { 
      var tr = document.createElement('tr'), 
        td0 = document.createElement('td'), 
        td1 = document.createElement('td'), 
        td2 = document.createElement('td'), 
        td3 = document.createElement('td'), 
        td4 = document.createElement('td'), 
        btnDelete = document.createElement('input'), 
        btnEdit = document.createElement('input'); 
 
      btnDelete.setAttribute('type', 'button'); 
      btnDelete.setAttribute('value', 'Delete'); 
      btnDelete.setAttribute('class', 'btnDelete'); 
      btnDelete.setAttribute('id', i); 
 
      btnEdit.setAttribute('type', 'button'); 
      btnEdit.setAttribute('value', 'Edit'); 
      btnEdit.setAttribute('id', i); 
 
      tr.appendChild(td0); 
      tr.appendChild(td1); 
      tr.appendChild(td2); 
      tr.appendChild(td3); 
      tr.appendChild(td4); 
 
      td0.innerHTML = userData[i].name; 
      td1.innerHTML = userData[i].quantity; 
      td2.innerHTML = userData[i].price; 
      td3.appendChild(btnEdit); 
      td4.appendChild(btnDelete); 
 
 
      btnDelete.onclick = (function() { 
        return function() { 
          if (confirm("Вы уверены что хотите удалить?")) { 
            var deleteId = this.getAttribute('id'); 
            userData.splice(deleteId, 1); 
            updateTable(); 
            refreshForm(); 
          } 
        }; 
      })(); 
 
      btnEdit.addEventListener('click', function() { 
        var editId = this.getAttribute('id'); 
        window.scrollTo({ 
          top: 0, 
          left: 0, 
          behavior: 'smooth' 
        }); 
        updateForm(editId); 
      }, false); 
 
      tbody.appendChild(tr); 
    } 
    dataTable.appendChild(tbody); 
  } 
 
  // Задаю форму для редактирования данных 
  var updateForm = function(id) { 
    console.log(userData[id].name); 
    var quantityField = document.getElementById('quantity'), 
      nameField = document.getElementById('name'), 
      priceField = document.getElementById('price'), 
      saveButton = document.getElementById('btnSave'); 
 
    quantityField.value = userData[id].quantity; 
    nameField.value = userData[id].name; 
    priceField.value = userData[id].price; 
    saveButton.value = 'Update'; 
    saveButton.setAttribute('data-update', id); 
  } 
 
  // Сохраняю новые данные 
  var saveData = function() { 
    var 
      newQuantity = document.getElementById('quantity').value, 
      newName = document.getElementById('name').value, 
      newprice = document.getElementById('price').value, 
      datatoAdd = { 
        quantity: newQuantity, 
        name: newName, 
        price: newprice 
      }; 
 
    userData.push(datatoAdd); 
    updateTable(); 
  } 
 
  // Обновляю данные 
  var updateData = function(id) { 
    var 
      upQuantity = document.getElementById('quantity').value, 
      upName = document.getElementById('name').value, 
      upprice = document.getElementById('price').value; 
 
    userData[id].quantity = upQuantity; 
    userData[id].name = upName; 
    userData[id].price = upprice; 
    updateTable(); 
  } 
 
  // Обновить форму 
  var refreshForm = function() { 
    var 
      quantityField = document.getElementById('quantity'), 
      nameField = document.getElementById('name'), 
      priceField = document.getElementById('price'), 
      saveButton = document.getElementById('btnSave'); 
 
    quantityField.value = ''; 
    nameField.value = ''; 
    priceField.value = ''; 
    saveButton.value = 'add'; 
    saveButton.removeAttribute('data-update'); 
  } 
 
  // Главные функции 
  var init = function() { 
    updateTable(); 
    var btnSave = document.getElementById('btnSave'), 
      btnRefresh = document.getElementById('btnRefresh'); 
 
    btnSave.onclick = function() { 
      if (btnSave.getAttribute('data-update')) { 
        updateData(btnSave.getAttribute('data-update')); 
      } else { 
        saveData(); 
      } 
      refreshForm(); 
    }; 
 
    btnRefresh.onclick = function() { 
      refreshForm(); 
    }; 
  }; 
 
  init(); //Инициализация таблицы 
})();

<table class="table" id="table1"> 
  <thead id="table-head"> 
    <tr> 
      <th class="table-th__name"><input onclick='sortTableName()' type="checkbox" id="stateInput3"> 
        <label for="stateInput3" class="arrows3"></label>Name</th> 
      <th class="table-th__quantity">Quantity</th> 
      <th class="table-th__price"> <input onclick='sortTable(2)' type="checkbox" id="stateInput2"> 
        <label for="stateInput2" class="arrows2"></label>Price</th> 
      <th class="table-th__action">Action</th> 
      <th class="table-th__none"></th> 
    </tr> 
  </thead> 
</table> 
 
<div class="form-container"> 
  <form class="form"> 
    <input type="text" maxlength="15" id="name" name="name" placeholder="Name" required /> 
    <input type="text" maxlength="15" id="quantity" name="quantity" placeholder="Quantity" required /> 
    <input type="text" maxlength="15" id="price" name="price" placeholder="Price" required /> 
    <input type="submit" value="Add" id="btnSave" required /> 
  </form> 
</div>