This script generates and displays an error field in the form:

var message = field.form.querySelector('.input__error#error-for-' + id ); if (!message) { message = document.createElement('span'); message.className = 'input__error'; message.id = 'error-for-' + id; // If the field is a radio button or checkbox, insert error after the label var label; if (field.type === 'radio' || field.type ==='checkbox') { label = field.form.querySelector('label[for="' + id + '"]') || field.parentNode; if (label) { label.parentNode.insertBefore( message, label.nextSibling ); } } // В противном случае вставьте его после поля if (!label) { field.parentNode.insertBefore( message, field.nextSibling ); } }

In this form:

 <span class="input__error" id="error-for-form-input-names">Заполните поле.</span>

Can you please tell me how to put this field inside a span block in a template, as shown in the example below?

 <span class="input__text"> <span class="input__label">Имя</span> <span class="input__error" id="error-for-form-input-names">Заполните поле.</span> </span>

thank

1 answer 1

Maybe that's it?

 var container = document.querySelector('.input__text'); var message = document.createElement('span'); message.id = 'error-for-form-input-names'; message.classList.add('input__error'); message.innerHTML = 'Заполните поле.'; container.appendChild(message);
  • Wrapped in container, but now all the fields are in one block - paveell
  • Line 97 jsfiddle.net/paveell/2d8n5o4d/6 - paveell
  • @paveell in your case, most likely instead of container.appendChild (message) you need to write field.parentNode.insertBefore (message, field); - i.prikot