Прошу помощи в вопросе отправки нескольких форм.
Суть такова - одностраничник с 4 разными по виду, но идентичными по сути формами.
Задачи - все формы должны работать.
Я их крутила уже как могла, всем задала разные имена и классы. Валидация у всех работает без проблем, а вот отправляется только 1 форма и все тут.
Использую такую конструкцию по примеру с
http://habrahabr.ru/sandbox/68000/
Вот тот ужас, что я свершила путем копирования и клонирования:
function ajax() { //Ajax отправка формы
var msg = $("#form").serialize();
$.ajax({
type: "POST",
url: "./send.php",
data: msg,
success: function(data) {
$("#results").html(data);
},
error: function(xhr, str){
alert("Возникла ошибка!");
}
});
}
function ajax() { //Ajax отправка формы
var msg = $("#formkonsult").serialize();
$.ajax({
type: "POST",
url: "./send2.php",
data: msg,
success: function(data) {
$("#results2").html(data);
},
error: function(xhr, str){
alert("Возникла ошибка!");
}
});
}
function ajax() { //Ajax отправка формы
var msg = $("#formprice").serialize();
$.ajax({
type: "POST",
url: "./price.php",
data: msg,
success: function(data) {
$("#resultsf").html(data);
},
error: function(xhr, str){
alert("Возникла ошибка!");
}
});
}
function ajax() { //Ajax отправка формы
var msg = $("#form-okno").serialize();
$.ajax({
type: "POST",
url: "./call.php",
data: msg,
success: function(data) {
$("#results-okno").html(data);
},
error: function(xhr, str){
alert("Возникла ошибка!");
}
});
}
И ВАЛИДАЦИЯ, ДЛЯ ПРИМЕРА 1 РАЗ (РАБОТАЕТ ВСЯ - 4 РАЗА)
$(document).ready(function(){ //Валидация формы
$(".send2").validation(
$(".name2").validate({
test: "blank letters",
invalid: function(){
if($(this).nextAll(".error").notExists()) {
$(this).after('<div id="error4" class="error">Введите корректное имя</div>');
$(this).nextAll(".error").delay(2000).fadeOut("slow");
setTimeout(function () {
$(".name2").next(".error").remove();
}, 2600);
}
},
valid: function(){
$(this).nextAll(".error").remove();
}
}),
$(".email2").validate({
test: "blank email",
invalid: function(){
if($(this).nextAll(".error").notExists()) {
$(this).after('<div id="error6" class="error">Введите корректный e-mail</div>');
$(this).nextAll(".error").delay(2000).fadeOut("slow");
setTimeout(function () {
$(".email2").next(".error").remove();
}, 2600);
}
},
valid: function(){
$(this).nextAll(".error").remove();
}
}),
$(".subject2").validate({
test: "blank digits",
invalid: function(){
if($(this).nextAll(".error").notExists()) {
$(this).after('<div id="error5" class="error">Введите номер телефона</div>');
$(this).nextAll(".error").delay(2000).fadeOut("slow");
setTimeout(function () {
$(".subject2").next(".error").remove();
}, 2600);
}
},
valid: function(){
$(this).nextAll(".error").remove();
}
})
);
});
Php не привожу - оно отрабатывает отлично, благо с этим языком у нас отношения сложились лучше.
Вот html
<div class="form-stat">
<form id="form" method="post" action="javascript:void(0);" onsubmit="ajax()">
<input id="yslovia-form1" type="text" name="name" class="name" placeholder="ВАШЕ ИМЯ">
<input id="yslovia-form2" type="text" name="subject" class="subject" placeholder="ТЕЛЕФОН*">
<input id="yslovia-form3" type="text" name="email" class="email" placeholder="E-MAIL*">
<input id="yslovia-form4" class="send button2" name="send" type="submit" value="">
</form>
<div id="results"></div>
<form id="formprice" method="post" action="javascript:void(0);" onsubmit="ajax()">
<input id="price-form1" type="text" name="namef" class="namef" placeholder="ВАШЕ ИМЯ">
<input id="price-form3" type="text" name="subjectf" class="subjectf" placeholder="ТЕЛЕФОН*">
<input id="price-form2" type="text" name="emailf" class="emailf" placeholder="E-MAIL*">
<input id="price-form4" class="sendf button7" name="sendf" type="submit" value="">
</form>
<div id="resultsf"></div>
и так далее...
Единственное, пожалуйста, результат (ответ сервера) должен носить разные имена. Т.е. results1, results2, results3, results4. Так как ответ (по верстке) должен писаться либо над формой, либо под ней - разный айди - разные стили у каждого блока.
Я уже голову сломала... Может кто знает решение?