Отправить HTML-форму, используя JavaScript

Question

Отправить HTML-форму, используя JavaScript

Я представляю terms and conditions модально пользователю до регистрации, но у меня возникла проблема с отправкой формы. Я думаю, что это может быть потому, что кнопка отправки находится за пределами формы?

HTML

<form method="POST" id="registerUser" autocomplete="signupForm-noFill" action={{url("/register")}}>
...
<button type="submit" id="registerButton" role="button" class="btn btn-hp-modal btn-signup">Sign up</button>
</form>

Модальный (за пределами формы выше)

....
<button type="submit" id="acceptTerms" class="btn btn-hp-modal underline btn-signup-modal">I Accept</button>

JavaScript

$('#registerButton').click(function() {
$("#legalModal").modal("show");
return false;
});

$(document).ready(function () {
$("#acceptTerms").click(function () {
$("#registerUser").submit();
});
});

Когда я пытаюсь отправить форму, происходит обновление страницы и добавление ? до конца URL: /signup?, Если я попытаюсь отправить его без модального, то он работает нормально.

1

forms html javascript php submit-button

Решение

Другие решения

Других решений пока нет …

Источник

Accepted Answer

Ваша кнопка имеет тип submit, поэтому она отправит данные формы, как родительский. form тег говорит ему, и не будет учитывать ваши click функция, так как она меняет страницу.
Вы должны предотвратить естественное поведение кнопки отправки.

Способ сделать это preventDefault:

$("#acceptTerms").click(function (event) {
event.preventDefault(); //prevent from natural behaviour
$("#registerUser").submit();
});

1