Блог

У меня есть длинная форма, которую можно прокручивать, поскольку она сохраняется при нажатии кнопки, но как прокручивать вверх, если появляется ошибка?

Я создал форму. Теперь в списке 40 пунктов. Есть несколько выпадающих списков, некоторые текстовые поля и некоторые флажки. Я также сделал обязательные поля. Но теперь кнопка находится внизу. Поэтому мне нужно предоставить функциональность, которая, если пользователь нажимает кнопку и происходит проверка, показывает некоторое сообщение об ошибке и автоматически прокручивается вверх.

Я не знаю, как это было бы возможно. Я работаю над ASP.NET веб-сайт с использованием bootstrap-дизайна.

Я предполагаю, что из ваших тегов вы можете использовать JS, так что вот ванильное решение:

 // Trigger the error
if (error) {
    // Get the element by its id
    var errorElement = document.getElementById("errorElementId");
    // Scroll to it
    window.scrollTo(0, errorElement.offsetTop);
}
  

Это также предполагает, что ваша форма не находится внутри элемента с overflow: scroll на нем. В этом случае вам нужно убедиться, что родительский элемент имеет position: relative и использует это:

 // Trigger the error
if (error) {
    // Get the element 
    var errorElement = document.getElementById("errorElementId");
    // Get the parent element
    var parentElement = document.getElementById("parentElementId");
    // Scroll to it
    parentElement.scrollTop = errorElement.offsetTop;
}