Как избежать автоматического перенаправления после отправки формы?

Каким образом можно изменить процесс перенаправления по завершении скрипта отправки формы в корзину, чтобы пользователь оставался на текущей странице, а не был перенаправлен обратно на неё после добавления товара в корзину?
  • 17 мая 2024 г. 13:20
Ответы на вопрос 2
Для того чтобы избежать автоматического перенаправления после отправки формы и изменить процесс перенаправления после добавления товара в корзину, можно использовать JavaScript.

1. Избежать автоматического перенаправления после отправки формы:
Для этого можно использовать метод event.preventDefault() в обработчике события submit формы. Пример:

```javascript
document.querySelector('form').addEventListener('submit', function(event) {
  event.preventDefault();
  // Ваш код обработки формы
});
```

2. Изменить процесс перенаправления после добавления товара в корзину:
При добавлении товара в корзину через форму, можно также использовать event.preventDefault() и после успешного добавления товара выполнить нужные действия (например, показать пользователю сообщение о добавлении товара в корзину). Пример:

```javascript
document.querySelector('form').addEventListener('submit', function(event) {
  event.preventDefault();
  
  // Ваш код добавления товара в корзину
  
  alert('Товар успешно добавлен в корзину!');
});
```

Таким образом, пользователь останется на текущей странице и увидит сообщение об успешном добавлении товара в корзину, вместо автоматического перенаправления.
У тега form есть атрибут target, который указывает, куда будет загружаться вывод скрипта. Можно создать скрытый iframe и перенаправлять вывод вызванного скрипта туда. 

<h1>Hello <?= $_POST['id'] ?? 0; ?></h1>

<form target="trash" method="post">
    <input type="text" name="id">
    <button type="submit">Отправить</button>
</form>

<iframe id="frm" name="trash" style="display: none"></iframe>


При большом желании этот вывод можно будет прочитать через js
<button type="button" onclick="alert(document.getElementById('frm').contentDocument.body.innerHTML)">Получить</button>


Но вообще не понятно, зачем это делать, ведь вам нужно будет отобразить, что в корзине уже лежит 1 товар, а для этого лучше все-таки перерисовать страницу.
Похожие вопросы