Как сделать универсальный скрипт для проверки и отправки нескольких форм?

Question

[efimenko_b]

На сайте имеется 8 форм, такого типа:

<form id="form1" method="POST" action="javascript:void(null);" onsubmit="call()">
						<label>Ваше имя</label>
						<input type="text" placeholder="Иван Иванов" name="name" id="name">
						<div class="form-phone">
							<label>Ваш телефон</label>
							<input type="text" placeholder="+7" name="phone1" id="phone1">
							<input type="text" placeholder="123" name="phone2" id="phone2">
							<input type="text" placeholder="4567890" name="phone3" id="phone3">
						</div>
						<label>Ваш e-mail</label>
						<input type="email" placeholder="[e-mail]" name="email" id="email">
						<input type="submit" value="Получить дизайн-проект">
					</form>

Есть кусок js:

function call(){
  	var msg   = $('#form1').serialize();
    $.ajax({
      type: 'POST',
      url: 'mail.php',
      data: msg,
      success: function() {
      	$('a#inline6').click();
      },
      error:  function(xhr, str){
            alert('Возникла ошибка: ' + xhr.responseCode);
      }
    });
};
$('#form1 input[type=submit]').validation(
         $('#form1 input[name="phone1"], #form1 input[name="phone2"], #form1 input[name="phone3"]').validate({test:'blank',
    valid: function(){
        
    },

    invalid: function(){
        
    }

     })
    );

На данный момент работает отправка и валидация только одной формы, у которой id form1, не создавать же 8 функций, не прописывать валидацию для каждой формы....
Можно как то сделать что бы валидация была именно для формы которая отправляется и ajax функция что бы срабатывала только для формы которая отправляется?

Answer 1

[Павел Елизарьев]

Вы можете использовать итератор jQuery.each() для перебора всех форм. Ваши обработчики можно разместить внутри callback функции.

Answer 2

[JoveLebedev]

можно шаблонизировать.
отправлять на обработку только те формы, у которых есть определенные данные, значения.
а в инпутах указывать класс, по которому будет определяться вид проверки и ее надобность.
например:
if('.phone') ....
if('.email'): ....
if('.name'): ..

Comments

[efimenko_b]

не понимаю, что должно быть в этих условиях?

[JoveLebedev]

habrahabr.ru/sandbox/68000

[efimenko_b]

JoveLebedev: я читал эту статью, но там пример с одной формой, а именно #form и на валидации только она, а у меня таких 8 и если я отправляю данные с одной, у меня проверяются на валидацию все.

[JoveLebedev]

$('form').on('submit', function() {
var forma = $(this);
}
переменная forma и есть отправляемая форма. её и проверяйте

Answer 3

[jlekapb]

так обращайтесь к форме по классу, а не id, а если нужно все формы разом отправить(сложно представить зачем), то про each уже написали.

Comments

[efimenko_b]

ну тогда все формы будут проверятся и если не заполнена хоть одна, не отправится вообще не одна.

[jlekapb]

обращайтесь в контексте this

[efimenko_b]

jlekapb: использовал, получился такой код:
$('form').on('submit', function() {
forma = $(this);
forma.children('input[type=submit]').validation(
forma.children('input[name="phone1"]').validate({test:'blank',
valid: function(){
},
invalid: function(){
}

})
);
call();

});
function call(){
var msg8 = forma.serialize();
$.ajax({
type: 'POST',
url: 'mail.php',
data: msg8,
success: function() {
$('a#inline6').click();
},
error: function(xhr, str){
alert('Возникла ошибка: ' + xhr.responseCode);
}
});
};
Форма отправляется, но не происходит валидация....

Answer 4

[Сергей]

Я использую примерно такой код для отправки форм, назначаю только id разные

$("form").submit(function () {
        var idform = $(this).attr("id");
        var name = $(this).find(".name").val();
        var cost = $(this).find(".cost").val();
        var city = $(this).find(".city").val();
.....................
 if (error > 0) {
            return false;
        }
        else {

            $.post("/send.php",
                    {
                        'name': name,
                        'cost': cost,
                        'city': city,
                        'act': "operator"
                    },
            function (result) {
                if (result == '1') {
                    $('#'+idform).html('<p>Заявка отправленна</p>');
                }
                else
                    alert("Произошла ошибка при отправке.");
            }
            );
        }

        return false;
    });