При использовании jQuery-оверлея для загрузки сообщение об ошибке валидации оказывается скрытым. Как избежать этой проблемы?
$(document).ready(() => {
$('#btnSubmit').on('click', () => $('#overlay').fadeIn());
});
@if(ViewData["Valid"] as bool? ?? false) {
<script>
$(document).ready(() => $('#btnSubmit').on('click', () => $('#overlay').slideDown()));
</script>
}
Может, добавить задержку перед появлением overlay, чтобы сообщение успевало встать на место? Возможно, стоит перестроить логику вызова анимации с учетом видимости ошибок. Что думаете по этому поводу?
Лучше не навязывать анимацию без проверки наличия ошибки. В моем опыте сначала рендерили сообщение об ошибке, а overlay вызывался только при успешной валидации. Можно также использовать callback или промисы для последовательного исполнения анимации. Это позволит избежать того, что сообщение оказывается скрыто overlay, и сохранит логику отрисовки ошибок более понятной.
Мне кажется, что стоит попробовать вычислять наличие ошибок сразу после отправки формы и только потом показывать overlay. В моем случае, если ошибки обнаружились, я сразу отменял показ всплывающего окна. Получается, что логика отрисовки ошибок отделена от анимации. Это решило проблему, когда сообщение об ошибке становилось невидимым. Возможно, понадобится немного изменить последовательность выполнения JS-кода, чтобы добиться нужного эффекта и сохранить поведение страницы интуитивным для пользователя.
Попробуйте сначала проверить наличие ошибок, и только потом запускать overlay. Возможно, имеет смысл осуществлять вызов с задержкой, чтобы ошибки точно отображались перед анимацией. А вы пробовали разделять логику проверки и анимации? Какие результаты получили?