На самом деле это большая форма, это одно поле
<form class="bmlf-form needs-validation" method="POST" novalidate>
<input type="text" class="form-control" id="contactPhone" name="ContactPhone" required>
<button type="submit" class="orange marketing-button bmlf-submit">SUBMIT</button>
</form>
Эта форма при отправке вызывает API и что-то делает. Функционально все работает. Как только форма отправлена, пользователю показывается окно с сообщением «Спасибо» с кнопкой «ОК» в поле «Спасибо». Проблема заключается в том, что после того, как пользователь нажал Ok в окне предупреждения, форма снова отправляется повторно, и проверки формы запускаются автоматически. Окно оповещения Ok ведет себя так, как будто я нажимаю кнопку «Отправить» без ввода каких-либо данных. Мне просто нужно обновить страницу после того, как я нажму "ОК" в окне предупреждения.
Я делаю ajax-вызов, поэтому в моей форме jquery также есть функция warn.default (), а также функция сброса в моей форме для сброса всех полей после отправки формы.
Код кнопки отправки Jquery
window.addEventListener("load", () => {
$(".bmlf-form").on("submit", event => {
// Trimming input data to eliminate white spaces
var allInputs = $(":input");
allInputs.each(function () {
$(this).val($.trim($(this).val()));
});
event.preventDefault();
const values = $(event.target).serializeArray();
$.ajax({
url: `apiURL`,
type: 'Post',
crossDomain: true,
async: true,
datatype: 'json',
data: JSON.stringify(objectifyForm(values)),
contentType: 'application/json; charset=utf-8',
success: function (data) {
alert("Thank you");
$(".bmlf-form")[0].reset();
},
error: function () {
alert("Please try again");
}
});
});
});
Form.js код
(function () {
window.addEventListener(
"load",
() => {
// Fetch all the forms we want to apply custom Bootstrap validation styles to
const forms = document.getElementsByClassName("needs-validation");
// Loop over them and prevent submission
Array.prototype.filter.call(forms, form => {
form.addEventListener(
"submit",
event => {
if (form.checkValidity() === false) {
event.preventDefault();
event.stopImmediatePropagation();
event.stopPropagation();
}
form.classList.add("was-validated");
},
false
);
});
},
false
);
* +1025 *}) ();