Обработчик формы
здравствуйте, есть обработчик формы
$(document).ready(function(){
var pattern = /^[а-яА-Яa-zA-ZёЁ ]{3,15}$/i;
var name = $('#name');
name.blur(function(){
if(name.val() != '' && name.val() !='Имя'){
if(name.val().search(pattern) == 0){
$('#valid1').html(' <img src="http://modus-crimea.ru/images/galochka.gif" />');
//$('#submit').attr('disabled', false);
name.removeClass('error').addClass('ok');
}else{
$('#valid1').text('');
$('#submit').attr('disabled', true);
name.addClass('error');
}
}else{
$('#valid1').text('');
name.addClass('error');
$('#submit').attr('disabled', true);
}
})
});
$(document).ready(function(){
var pattern = /^[a-z.0-9_-]+@[a-z0-9-]+\.[a-z]{2,6}$/i;
var email = $('#email');
email.blur(function(){
if(email.val() != ''){
if(email.val().search(pattern) == 0 && email.val() !='Email'){
$('#valid').html(' <img src="http://modus-crimea.ru/images/galochka1.gif" />');
//$('#submit').attr('disabled', false);
email.removeClass('error').addClass('ok');
}else{
$('#valid').text('');
$('#submit').attr('disabled', true);
email.addClass('error');
}
}else{
$('#valid').text('');
email.addClass('error');
$('#submit').attr('disabled', true);
}
});
});
$(document).ready(function(){
var pattern = /^[а-яА-Я,.0-9! ]{3,60}$/i;
var subject = $('#subject');
subject.blur(function(){
if(subject.val() != '' && subject.val() !='Тема сообщения'){
if(subject.val().search(pattern) == 0){
$('#valid2').html(' <img src="http://modus-crimea.ru/images/galochka2.gif" />');
//$('#submit').attr('disabled', false);
subject.removeClass('error').addClass('ok');
}else{
$('#valid2').text('');
$('#submit').attr('disabled', true);
subject.addClass('error');
}
}else{
$('#valid2').text('');
subject.addClass('error');
$('#submit').attr('disabled', true);
}
});
});
$(document).ready(function(){
var pattern = /^[а-яА-ЯЁё,.0-9!a-zA-Z-!""'@:;+=#№%&* \n\r]{3,600}$/i;
var message = $('#message');
message.blur(function(){
if(message.val() != '' && message.val() !='Текст сообщения'){
if(message.val().search(pattern) == 0){
$('#valid3').html(' <img style="vertical-align:80px" src="http://modus-crimea.ru/images/galochka3.gif" />');
//$('#submit').attr('disabled', false);
message.removeClass('error').addClass('ok');
}else{
$('#valid3').text('');
$('#submit').attr('disabled', true);
message.addClass('error');
}
}else{
$('#valid3').text('');
message.addClass('error');
$('#submit').attr('disabled', true);
}
});
});
в каждой функции закомментировано включение кнопки submit подскажите как сделать чтоб кнопка активировалась только тогда когда все поля будут заполнены правильно? |
пытался сделать так
$(document).ready(function(){
if($('#name').hasClass("ok") && $('#email').hasClass("ok") && $('#subject').hasClass("ok") && $('#message').hasClass("ok"))
{
$('#submit').attr('disabled', false);
}
});
не работает |
Попробуй $('#submit').prop('disabled', false);
|
Вариант подхода к валидации форм:
http://www.w3schools.com/js/js_validation.asp |
Попробуй $('#submit').prop('disabled', false);
так тоже не работает( |
Цитата:
мне бы с этим разобраться.. |
Вариант:
1. Создать функцию высшего порядка validateForm ( принимает отдельные функции-валидаторы в качестве аргументов ) где параметр vaidatorList это массив функций-валидаторов [ fn1, fn2, ..., fnN ]
validateForm = function ( validatorList ) {
...
}
которая возвращает false, если хоть один из валидаторов вернул false 2. Создавать необходимые валидаторы и передавать в качестве аргументов: validateForm( [ fn1, fn2, ..., fnN] ); 3. Создать функцию-обработчик события для onsubmit, скажем:
onSubmitForm = function () {
return validateForm( [ fn1, fn2, ... , fnN ] );
}
|
Цитата:
|
galochka.gif, galochka1.gif, galochka2.gif, ... - они что настолько различны, что одной картинкой не обойтись? )
|
Костыли ( не видя html ):
if ( $( '#name' ).hasClass( "ok" )
&& $( '#email' ).hasClass( "ok" )
&& $( '#subject' ).hasClass( "ok" )
&& $( '#message' ).hasClass( "ok" ) )
{
$( '#submit' ).attr( 'disabled', false );
}
добавить в конец ВСЕХ анонимных коллбэков .blur() |
| Часовой пояс GMT +3, время: 02:12. |