Две одинаковые формы (form) на одной странице сайта.. Нижняя не отправляет данные

190

13 апреля 2022, 06:00

Ребята, помогите разобраться с формами. Две одинаковые формы, на одной странице. Верхняя, в верху страницы - работает, коряво но работает. Нижняя, в низу страницы, имеет полностью такой же код как верхняя, не отправляет данные - Заполните все поля, всплывает окно. Код формы:

<form id="recallForm" method="post" action="/mail/recallmail.php">
<input class="recallInput" type="text" name="name" maxlength="30" placeholder="Ваше имя" required>
<input class="recallInput" type="tel" name="phone" placeholder="8 (___) ___ - __ -__" maxlength="15" required>
    <input type="hidden" name="page" value="Замена ручек">
<input type="button" class="btn" value="Отправить!" onclick="recall()">
</form>

Я плохо разбираюсь в php и скриптах. Мне её установил знакомый один и пропал. Пытаюсь разобраться, понять миниум.который нужен. На этой же странице присутствует скрипт. Вот его код:

<script>
function recall(){
$.post("/mail/recallmail.php",$("#recallForm").serialize(),function ( data ){
$(".recallInput").val("");
window.location.hash="sensorReplacement";
alert(data);
});
};
</script>

Я примерно понимаю что надо изменить id в нижней форме. Или добавить id к полям ввода данных.... ID у формы есть, я нижней форме присвою уникальный id. А как его добавить в код скрипта?
Для понимания, вот код нижний формы. Я сразу изменил id.

<form id="otherrepairForm" method="post" action="/mail/recallmail.php">
<input class="recallInput" type="text" name="name" maxlength="30" placeholder="Ваше имя" required>
<input class="recallInput" type="tel" name="phone" placeholder="8 (___) ___ - __ -__" maxlength="15" required>
    <input type="hidden" name="page" value="Замена ручек">
<input type="button" class="btn" value="Отправить!" onclick="recall()">
</form>

Как изменить скрипт? Прописать отдельную функцию?

Answer 1

<input type="button" class="btn" value="Отправить!" onclick="recall(this)">
function recall(btn) {
  var $form = $(btn).closest("form"); 
  $.post("/mail/recallmail.php", $form.serialize(), function(data) {
    $form.find(".recallInput").val("");
    window.location.hash = "sensorReplacement";
    alert(data);
  });
};