Подскажите, пожалуйста, в официальной документации к Bootstrap 5 описан способ валидации (
ссылка). Нам интересен код JS, где устанавливается обработчик на кнопку submit.
1) А как сравнить два пароля? И если они разные - подсветить второй пароль и вывести сообщение, что введенные значения не совпадают.
2) Как можно выводить разные сообщения: если поле пустое - о том, что надо что-то ввести; если пароли не совпадают - уже о том, что они разные.
Я сделал так (см. ниже), оно работает, но выводится в любом случае только то, что указано в
<div class="invalid-feedback">Поле обязательно для заполнения.</div>
То есть нет классификации "типа ошибок".
(() => {
'use strict'
// Fetch all the forms we want to apply custom Bootstrap validation styles to
const forms = document.querySelectorAll('.needs-validation');
// Loop over them and prevent submission
Array.from(forms).forEach(form => {
form.addEventListener('submit', event => {
const formData = new FormData(form);
const password = formData.get('Password');
const repeatPassword = formData.get('ConfirmPassword');
if (!form.checkValidity() || password !== repeatPassword) {
const repeatPassword = document.getElementById('ConfirmPassword');
repeatPassword.classList.add("is-invalid");
event.preventDefault();
event.stopPropagation();
}
form.classList.add('was-validated');
}, false)
})
})()