Как прокручивать вверх автоматически, когда кнопка нажата и ошибка приходит в длинной форме

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

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

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

1 ответ

  1. Я предполагаю из ваших тегов, что вы можете использовать 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;
    }