и так есть форма с ajax запросом с проверка полей на пустоту, и так когда все заполняем в одном форме полей, и нажмём отправить то, Javascript проверяет все формы, и по этому форма не отправляется. Нужно чтобы он только в одном форме проверил, всех полей. Таких форм 3 на странице. И Javascript проверяет каждый.
$(function() {
//при нажатии на кнопку с id="send"
$('#send').click(function() {
//переменная formValid
var formValid = true;
//перебрать все элементы управления input
$('input').each(function() {
//найти предков, которые имеют класс .form-group, для установления success/error
var formGroup = $(this).parents('.form-group');
//найти glyphicon, который предназначен для показа иконки успеха или ошибки
var glyphicon = formGroup.find('.form-control-feedback');
//для валидации данных используем HTML5 функцию checkValidity
if (this.checkValidity()) {
//добавить к formGroup класс .has-success, удалить has-error
formGroup.addClass('has-success').removeClass('has-error');
//добавить к glyphicon класс glyphicon-ok, удалить glyphicon-remove
glyphicon.addClass('glyphicon-ok').removeClass('glyphicon-remove');
} else {
//добавить к formGroup класс .has-error, удалить .has-success
formGroup.addClass('has-error').removeClass('has-success');
//добавить к glyphicon класс glyphicon-remove, удалить glyphicon-ok
glyphicon.addClass('glyphicon-remove').removeClass('glyphicon-ok');
//отметить форму как невалидную
formValid = false;
}
});
//если форма валидна, то
if (formValid) {
jQuery.ajax({ // Начала конструкции для работы с Ajax через jQuery
type: "GET", // Метод, которым получаем данные из формы
url: "/mail.php", // Обработчик формы.
data: jQuery(".form").serialize(), // Этот метод, берет форму с id=form и достает оттуда данные
success: function(html) { // функция выполняемая при успешном отправлении данных
$("#myCallback").modal('hide'); //закрываем окно
$("#myrequery").modal('show'); //закрываем окно
//setTimeout("('#myrequery').modal('hide')",2000);
setTimeout(function() {
$("#myrequery").modal('hide')
}, 3000);
$(".form")[0].reset(); // ресет формы
$(".has-feedback").removeClass('has-success');
}
});
}
});
});
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap-theme.min.css" rel="stylesheet" />
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet" />
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<form class="form">
<div class="form-group has-feedback">
<label for="summa">Сумма</label>
<input type="text" id="summa" placeholder="4 500 000 сум" class="form-control" name="summa" required="required">
</div>
<div class="form-group has-feedback">
<label for="avans">Аванс (%)</label>
<input type="text" id="avans" placeholder="30%" class="form-control" name="avans" required="required">
</div>
<div class="form-group has-feedback">
<label for="srok">Срок</label>
<select name="srok" id="srok" class="form-control" required="required">
<option value="24month">24 месяца</option>
<option value="3yearth">3 года</option>
<option value="4yearth">4 года</option>
<option value="5yearth">5 года</option>
</select>
</div>
<div class="form-group has-feedback">
<label for="nick-name">Ваше имя</label>
<input type="text" id="nick-name" placeholder="Ахмадбой" class="form-control" name="nick-name" required="required">
</div>
<div class="form-group has-feedback">
<label for="phone-number">Ваш телефон</label>
<input type="text" id="phone-number" placeholder="+99897 767-66-65" class="form-control" name="phone-number" required="required">
</div>
<button class="btn send" type="button">Отправить</button>
<p class="confident">Ваши контактные данные в безопаcности
<br>и не будут переданы <a data-toggle="modal" data-target="#youConfiditional">третьим лицам</a>
</p>
</form>