Всем привет! Подскажите как изменить цвет fieldset при отправки формы

Question

Мне нужно чтобы при пустом input, вложенном в fieldset, fieldset менял цвет своего border при отправки формы. Как это можно реализовать?

const form = document.querySelectorAll('.form');
const formInputs = document.querySelectorAll('.input')


formInputs.forEach(
  addEventListener('click', (e) => {
    e.previousElementSibling.classList.add('select');
  }),
);

.select {
  color: white;
}

<form class="form">
  <fieldset class="field">
    <legend>Text</legend>
    <input type="text" class='input' />
  </fieldset>
</form>

Answer 1

чтобы при пустом input, вложенном в fieldset, fieldset менял цвет своего border при отправки формы. Как это можно реализовать?

Например так...

const form = document.querySelectorAll('.form');
const field = document.querySelectorAll('.field');
const input = document.querySelectorAll('.input')

form.forEach(o => {
  o.addEventListener('submit', (e) => {
    e.preventDefault();
    input.forEach(function(e) {
      if (e.value === '') {
        e.parentNode.classList.add('error');
      }
    });
  });
});

.error {
  border: 1px solid red;
}
.input:focus + legend {
    color: red;
}

<form class="form">
  <fieldset class="field">
    <input type="text" class='input' />
    <legend>Text</legend>
  </fieldset>
  <button>Отправить</button>
</form>

БЛОГ НА HUSL

Всем привет! Подскажите как изменить цвет fieldset при отправки формы

Ответы (1 шт):