fantazer
12/21/2014 - 2:42 PM

Валидация формы

Валидация формы

//Сылка для скачивания https://drive.google.com/file/d/0B6ZSk-erOth7cmE4RFpFSUM0SW8/view?usp=sharing
// Сама форма //

<form role="form" id="myform">
    <select id="my_select">
	  <option value="Газель">Газель</option>
	  <option value="КАмаз">КАмаз</option>
	</select><br />

	<input id="name_form" type="text"  name="name" placeholder="Ваше имя"  /><br />
	<input id="email_form" type="text"  name="email" placeholder="Ваша почта"  /><br />
	<input id="phone_form" type="text"  name="phone" placeholder="Ваш телефон"  /><br />
	<textarea id="text" rows="15" cols="50" name="message" id="message" placeholder="Введите комментраий"></textarea><br />
	<input type="submit" value="Отправить" name="submit">
</form>

// Сама форма //

//Jquery //
$(document).ready(function(){
    	    
    	$('#myform').validate({
			rules:{ //правила для полей 
				name:{
					required:true,
					minlength:5 //минимальное значение поля
				},
				email:{
					required:true,
					email:true
				}
			},
			messages:{
				name:{
					required: 'Это поле обязатлеьно для заполнения', //какое сообщение будет выводиться
					minlength:'Имя должно быть не меньше 5 символов'
				},
				email:{
					required: 'Это поле обязатлеьно для заполнения',
					email:'Введите правильный адресс'
				},
				submitHandler:function(){ //выполнять если все валидно
					alert('Форма заполнена правильно');
				}
			}
		});

    	$('#myform').submit(function() { //обрабатываем событие отправки формы
    	var name =  $("#name_form").val(), // Собираем все значение полей для отправки 
            email = $("#email_form").val(),
            option = $("#my_select option:selected").val(),
            phone = $('#phone_form').val(),
            text = $('#text').val(),
           
            allData = 'name=' + name + '&email=' + email+'&option='+option+'&phone='+phone+'&text='+text; // формируем строку для предачи в бработчик
          $.ajax({
            type: "POST",
            url: "sender.php",
            data: allData,
            success: function () { // выполняется при успешном отправлении
            	alert('Все ушло');
            	alert(phone);
            }
          });
          return false;

		})

	})