Форма действия перенаправляет меня на другую страницу с JSON (JavaScript) - PullRequest
0 голосов
/ 03 января 2019

У меня есть простая (в основном рабочая) форма отправки:

<form action="http://127.0.0.1:3000/books" method="POST" class="addBook">
    <input type="text" placeholder="Title" name="title" required>
    <input type="text" placeholder="ISBN" name="isbn" required>
    <button id="submitBook" type="submit" onclick="addingBooks()">Submit</button> 
</form>

Моя форма правильно добавляет входные значения в мою базу данных, и затем она появляется в DOM, когда я возвращаюсь и обновляю страницу.

Я применил функцию protectDefault () в своем JavaScript-коде для функции 'addBooks ()', чтобы остановить ее повторную отправку, но я все еще не могу остановить ее переадресацию на страницу действия после отправки, на которой отображается только JSON представленных данных.

Если вам нужно больше, пожалуйста, дайте мне знать.

1 Ответ

0 голосов
/ 03 января 2019

Чтобы предотвратить действие по умолчанию для события, вам понадобится объект события, для которого будет вызываться предотвращениеDefault. Некоторые браузеры действительно имеют глобальный объект event, но это может быть ненадежно.
Самый простой вариант - вернуть false из события onlick, а не из функции, которую вы вызываете

<button id="submitBook" type="submit" onclick="addingBooks();return false;">Submit</button>

еще одним простым и лучшим решением было бы сделать кнопку обычной кнопкой вместо кнопки отправки и убрать protectDefault из addingBooks.

<button id="submitBook" type="button" onclick="addingBooks()">Submit</button>

другое и даже лучшее решение - вообще не использовать атрибут onclick, использовать функцию addEventListener

document.getElementById('submitBook').addEventListener("click", function(e){
  e.preventDefault();
  //other stuff
});
...