Javascript-форум (https://javascript.ru/forum/)
-   jQuery (https://javascript.ru/forum/jquery/)
-   -   Несколько контактных форм [ajax] (https://javascript.ru/forum/jquery/45622-neskolko-kontaktnykh-form-%5Bajax%5D.html)

RapCore 08.03.2014 16:24

Несколько контактных форм [ajax]
 
на странице есть 2 контактные формы. они имеют раздые id и разные js обработчики. то есть обработчики одинаковые только Id в них прописан разный.
пример
$(document).ready(function() {
$("#ajax-contact-form").submit(function() {
var str = $(this).serialize();

$.ajax({
type: "POST",
url: "contact.php",
data: str,
success: function(msg) {

if(msg == 'OK') {
result = '<div class="notification_ok">Спасибо!<br />Наш менеджер свяжется<br />с вами в ближайшее время</div>';
$('#ajax-contact-form').fadeOut(10);
} else {
$('#ajax-contact-form input[type=text]').addClass('error');
}
 
}
$('#note').html(result).fadeIn().delay(33999999).fadeOut("slow");


}
});
return false;
});
});

и
$(document).ready(function() {
$("#ajax-contact-form2").submit(function() {
var str = $(this).serialize();

$.ajax({
type: "POST",
url: "contact.php",
data: str,
success: function(msg) {

if(msg == 'OK') {
result = '<div class="notification_ok">Спасибо!<br />Наш менеджер свяжется<br />с вами в ближайшее время</div>';
$('#ajax-contact-form2').fadeOut(10);
} else {
$('#ajax-contact-form2 input[type=text]').addClass('error');
}
 
}
$('#note2').html(result).fadeIn().delay(33999999).fadeOut("slow");


}
});
return false;
});
});


скрипт проверяет отправку сообщения, если все ок то он прячет форму и выводит тест благодарности, если что то не заполнено то добавляет класса к инпутам.
проблема в том что после успешной отправки с одной формы то при попытке отправить с другой в любом случае выводится сообшение с благодарностью( получается и текст благодарности и форма с добавленным классом "error" )
как вот исправить это.
надеюсь что более-менее понятно объяснил

danik.js 08.03.2014 16:27

Пожинай плоды своей лени. Поленился изначально сделать нормально - теперь разгребай. У тя два куска кода на 99% одинаковы, неужели ты это не замечаешь?

RapCore 08.03.2014 17:09

да замечаю, я просто в js - 0 и не знал как сделать обработку двух форм в одном коде вот и сделал два под разные id

danik.js 08.03.2014 17:42

Навешивай общий обработчик submit на обе формы. Для этого в селекторе укажи айдишники через запятую: $('#id1, #id2').submit(...)
Далее в обработчике, this будет указывать на отправляемую форму. Сохрани ее в переменную form. Далее вместо
$('#ajax-contact-form2 input[type=text]')

Пиши: $('input[type="text"]', form) или $(form).find('input[type="text"]')

С #note поступи также.

RapCore 08.03.2014 19:22

danik.js,
спасибо большое, код получился более человечным, но все же проблема не решилась.
при повторной отправке данных с другой формы при клике на submit выводится сообщение об отправке.
я никак не могу понять почему оно появляется. ведь алгоритм следующий:
- отправка данных методом Post ;
- проверка наличия всех данных;
- если все данные есть -> отправляем сообщение и получаем "Ok";
- js проверят работы php скрипта, если результат == Ok то выводим сообщение и скрываем форму.

вроде все логично , но никак не пойму откуда появляется "сообщение об отправке" если обработчик не получает "ok"
вот живой пример http://wp-man.ru/video/ (там сейчас есть проверка всех полей на заполнение так что все заполните)
попробуйте отправить данные с первой формы, а потом сразу со второй

danik.js 08.03.2014 20:07

Дык у тебя в независимости от msg всегда выполняется такой код:
Цитата:

Сообщение от RapCore
$('#note').html(result)

При первой отправке ты создаешь глобальную переменную result (причем нерекомендуемым образом) со словами благодарности. Причем если msg не равно ОК, то переменная не будет создана и эта строка просто будет бросать исключение всякий раз при отправке до того как ты создашь result.


Часовой пояс GMT +3, время: 06:26.