Почему данный код работает не правильно?

Question

[SHNM]

Здравствуйте! Хочу сделать валидацию, то бишь, если все поля заполнены делать кнопку активной
Вот код

$('form').find('input').each(function () { 
 $($(this)).on('input', function () { 
 if ($(this).val().length == 0) { 
 $('.button').attr('disabled', true); 
 } 
 else { 
 $('.button').attr('disabled', false); 
 } 
 }) 
 })

Странно, он работает таким образом: если я заполню одно поле, то кнопка станет активной, а нужно, чтобы если все поля заполнены, то делать кнопку активной, что не так тут?))

Answer 1

[0xD34F]

Причина номер раз: потому что автор кода говнокодер. Ну, то есть - вы даже отформатировать код не удосужились. Причина номер два: проверяется состояние только одного инпута, того, где случилось событие. А надо проверять все.

Исправляем:

$('form').on('input', function() {
  $('.button').prop('disabled', $('input', this).get().some(n => !n.value));
}).trigger('input');

Или, к чёрту jquery:

const form = document.querySelector('form');
const button = document.querySelector('.button');

// можно по-прежнему самостоятельно проверять значения input'ов
const inputs = [...form.querySelectorAll('input')];
const onInput = () => button.disabled = !inputs.every(n => n.value);
form.addEventListener('input', onInput);
onInput();

// но если добавить input'ам атрибут required...
form.addEventListener('input', function() {
  button.toggleAttribute('disabled', !this.checkValidity());
});
form.dispatchEvent(new Event('input'));

Comments

[SHNM]

Но код не я писал, я его тут и нашел :)

[0xD34F]

SHNM, то есть, вдвойне говнокодер: не только сами написать не можете, но и готовому придать мало-мальски презентабельный облик не в состоянии.

[SHNM]

0xD34F, спасибо, работает))

[SHNM]

0xD34F, подскажите пожалуйста, как можно ещё передать и select?

[0xD34F]

Что значит "передать"? Может, проверить, что выбран пункт, отличный от дефолтного? Задать дефолтному пустое значение (value=""), а дальше всё так же, как и с input'ами. Селектор проверяемых элементов только исправить надо будет c "input" на "input, select".