Created
May 18, 2016 13:59
-
-
Save yaroslavKas/14ca3a5741f36ee665506c676d2291ce to your computer and use it in GitHub Desktop.
Валидация формы
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
.error-phone.error p{ | |
font-size: 11px; | |
color: #C32929; | |
line-height: 11px; | |
margin-bottom: 5px; | |
margin-top: 5px; | |
} | |
.error-box.error p{ | |
font-size: 11px; | |
color: #C32929; | |
line-height: 11px; | |
margin-bottom: 5px; | |
margin-top: 5px; | |
} | |
.error-phone.not_error p{ | |
font-size: 11px; | |
color: green; | |
line-height: 11px; | |
margin-bottom: 5px; | |
margin-top: 5px; | |
} | |
.error-box.not_error p{ | |
font-size: 11px; | |
color: green; | |
line-height: 11px; | |
margin-bottom: 5px; | |
margin-top: 5px; | |
} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
var rv_name = /^[а-яА-Я]+$/; | |
var rv_number =/[+]\d[ ][(]\d{3}[)][ ]\d{3}[-]\d{2}[-]\d{2}/; /*Работает только с маской*/ | |
jQuery('.name').after('<div class="error-box"></div>'); | |
jQuery('.phone').after('<div class="error-phone"></div>'); | |
jQuery('.name').keyup( function(){ | |
var box = jQuery(this).parent().find('.error-box'); | |
var name = jQuery(this).val(); | |
jQuery(box).css('display', 'block'); | |
if(name != '' && rv_name.test(name) && name.length >= 3){ | |
jQuery(this).next('.error-box').removeClass('error').addClass('not_error').html('<p>принято</p>'); | |
jQuery(name).next('.error-box').fadeIn('slow'); | |
jQuery(".submit").attr('disabled', false); | |
jQuery(this).parents('form').find('.submit').attr('disabled', false); | |
}else{ | |
jQuery(this).parents('form').find('.submit').attr('disabled', true); | |
jQuery(this).next('.error-box').removeClass('not_error').addClass('error').html('<p> - не менее 3 символов (RU)</p>'); | |
} | |
}); | |
jQuery('.phone').keyup( function(){ | |
var phone = jQuery(this).val(); | |
var box = jQuery(this).parent().find('.error-phone'); | |
jQuery(box).css('display', 'block'); | |
if(rv_number.test(phone)){ | |
jQuery(this).next('.error-phone').removeClass('error').addClass('not_error').html('<p>принято</p>'); | |
jQuery(this).parents('form').find('.submit').attr('disabled', false); | |
} | |
else{ | |
jQuery(this).parents('form').find('.submit').attr('disabled', true); | |
jQuery(this).next('.error-phone').removeClass('not_error').addClass('error').html('<p> - номер не менее 10 символов</p>'); | |
} | |
}); | |
function get_name_browser(){ | |
// получаем данные userAgent | |
var ua = navigator.userAgent; | |
// с помощью регулярок проверяем наличие текста, | |
// соответствующие тому или иному браузеру | |
if (ua.search(/Chrome/) > 0) return 'Google Chrome'; | |
if (ua.search(/Firefox/) > 0) return 'Firefox'; | |
if (ua.search(/Opera/) > 0) return 'Opera'; | |
if (ua.search(/Safari/) > 0) return 'Safari'; | |
if (ua.search(/MSIE/) > 0) return 'Internet Explorer'; | |
// условий может быть и больше. | |
// сейчас сделаны проверки только | |
// для популярных браузеров | |
return 'Не определен'; | |
} | |
var browser = get_name_browser(); | |
if(browser == 'Firefox'){ | |
jQuery('.submit').attr('disabled', true); | |
} | |
jQuery(".submit").click(function(){ | |
var name = jQuery(this).parent().find('.name'); | |
var phone = jQuery(this).parent().find('.phone'); | |
nameValid(name); | |
phoneValid(phone); | |
if(nameValid(name) == true){ | |
if(phoneValid(phone) == true){ | |
jQuery(this).attr('disabled', false); | |
jQuery(phone).next('.error-phone').fadeOut(2000); | |
jQuery(name).next('.error-box').fadeOut(2000); | |
} | |
else{ | |
jQuery(this).attr('disabled', true); | |
alertify.error('Заполните поле телефон', 4); | |
} | |
} | |
else{ | |
jQuery(this).attr('disabled', true); | |
alertify.error('Заполните поле имя', 4); | |
} | |
}); | |
function nameValid(argum){ | |
jQuery(argum).next('.error-box').fadeIn('slow'); | |
if(jQuery(argum).val() != '' && rv_name.test(jQuery(argum).val()) && jQuery(argum).val().length >= 3){ | |
jQuery(name).next('.error-box').removeClass('error').addClass('not_error').html('<p>принято</p>'); | |
return true; | |
} | |
else{ | |
jQuery(argum).next('.error-box').removeClass('not_error').addClass('error').html('<p> - не менее 3 символов (RU)</p>'); | |
return false; | |
} | |
} | |
function phoneValid(argum){ | |
jQuery(argum).next('.error-phone').fadeIn('slow'); | |
if(rv_number.test(jQuery(argum).val())){ | |
jQuery(argum).next('.error-phone').removeClass('error').addClass('not_error').html('<p>принято</p>'); | |
return true; | |
} | |
else{ | |
jQuery(argum).next('.error-phone').removeClass('not_error').addClass('error').html('<p> - номер не менее 10 символов</p>'); | |
return false; | |
} | |
} |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment