2009-12-20 2 views
0

Я написал простое значение проверки для необходимых входов, смотрите демо здесь:JQuery проверка ввода - отключить отправить - проблема

http://wip.redaxscript.com/login

$('.required').keyup(function(){ 
    if($(this).val() == '') { 
     $(this).addClass('warning'); 
     $('.meet').addClass('disabled').attr('disabled',true); 
    } else { 
     $(this).removeClass('warning'); 
     //if($(this).siblings('.required').val() == '') { 
     //this should check if other requiered fields are empty 
     //but it fails 
      $('.meet').removeClass('disabled').attr('disabled',false); 
     //} 
    } 
}); 

Если 1. ввести значение обоих входов и 2. удалите оба - и 3. затем введите значение в один из них, подача включена (сбой), но один необходимый ввод пуст, поэтому отправку еще нужно отключить.

Я попытался проверить братьев и сестер «.required» для своих значений, но он не работает.

+0

Вы можете изменить свой вопрос, нажав на серую 'ссылку edit' под ним. – SLaks

ответ

0

Предполагая, что вы хотите только хотите, чтобы активировать кнопку, если все из братьев и сестер имеют значение:

if ($('.required[value=]').length > 0) 
    $('.meet').removeClass('disabled').attr('disabled',false); 

Обратите внимание, что $(this).siblings('.required') не будет возвращать какие-либо элементы, поскольку он возвращает только прямые братьев и сестер. (Единственный прямой брат из input - его)

1

Возможно, вам захочется начать с того, что кнопка отправки отключена, если значения пусты и изменить их, когда у них что-то есть. Попытка:

if($('.meet').val() == ''){ 
    $('.meet').addClass('disabled').attr('disabled',true); 
} 

$('.required').keyup(function(){ 
    if($(this).val() == '') { 
     $(this).addClass('warning'); 
    }else{ 
     $(this).removeClass('warning'); 
    } 

    if($('.required[value=]').length == 0){ 
     $('.meet').removeClass('disabled').attr('disabled',false); 
    }else{ 
     $('.meet').addClass('disabled').attr('disabled', true); 
    } 
}); 
0

Вы должны начать с заблокированной кнопки входа в систему. Вы также должны установить отключенный атрибут на disabled не на true и false.

Вашего чек

$(this).siblings('.required').val() == '' 

не работает, потому что нет родственного .required в поле ввода вы. Ваш HTML выглядит следующим образом. Но второй вход не является братом, поскольку он имеет другого родителя.

<li> 
    <label for="username">Benutzername:</label> 
    <input type="text" name="username" id="username" class="text required" value="" maxlength="10" /> 
</li> 
<li> 
    <label for="password">Passwort:</label> 
    <input type="password" name="password" id="password" class="text required" value="" maxlength="10" /> 
</li> 

Исправленная JQuery Foo

$('.meet').addClass('disabled').attr('disabled','disabled'); 
$('.required').keyup(function(){ 
    if($(this).val() == '') { 
     $(this).addClass('warning'); 
     $('.meet').addClass('disabled').attr('disabled','disabled'); 
    } else { 
     $(this).removeClass('warning'); 
     if($(this).parent().next().find('input.required').val() != '') { 
      $('.meet').removeClass('disabled').attr('disabled',''); 
     } 
    } 
}); 
Смежные вопросы