Показать сообщение отдельно
  #1 (permalink)  
Старый 13.01.2017, 20:30
Профессор
Отправить личное сообщение для s24344 Посмотреть профиль Найти все сообщения от s24344
 
Регистрация: 12.08.2015
Сообщений: 206

validation - Валидация формы
Валидация формы
Здравствуйте. Подскажите, пожалуйста, что в данном случае я делаю не так. Строки кода, которые не работают, я выделил комментариями.

<!DOCTYPE html>
<html lang="ru">
<head>
	<meta charset="UTF-8">
	<title>form</title>
	<link rel="stylesheet" href="css/normalize.css">
	<link rel="stylesheet" href="css/main.css">
</head>
<body>
	<form class="form1">
		email: <input class="val__input_fname" type="text" name="email" value="email" /> <br />
	
		<input type="submit" />
	</form>

<script src="js/jquery-3.1.1.min.js"></script>
<script src="js/app.js"></script>
</body>
</html>


$(document).ready(function() {
	(function() {

		var 
			form = $("form.form1"),
			input__fname = $('input.val__input_fname');


		function validate(elem, pattern) {
		    var res = elem.val().search(pattern);

		    if ( res == -1 ) {
		    	elem.addClass("invalid", function() {
		    		$(this).removeClass("valid");
		    	});
		    }
		    else {
		    	elem.addClass("valid", function() {
	    			$(this).removeClass("invalid");
		    	});
		    }
		}
			
		function nameOnChange() {
			var pattern = /\b[a-z0-9._]+@[a-z0-9.-]+\.[a-z]{2,4}\b/i;

    		validate(input__fname, pattern);
		}

		input__fname.on('change', function() {
			nameOnChange();
		});

		function onsubmiHandler() {

			var  invalid = false;

			input__fname.trigger('change'); // не работает
			
			if ( input__fname.hasClass('invalid') ) {
				invalid = true;
			}

			if ( invalid ) {
				
				alert("Допущены ошибки при заполнении формы.");

				return false; // не работает
			}
		}

		form.on('submit', function() {
			onsubmiHandler();
		});
	})();
});

Последний раз редактировалось s24344, 13.01.2017 в 20:45.
Ответить с цитированием