ボタンをクリックした時に自動的に上にスクロールする方法と長いフォームでエラーが来る

Question

ボタンをクリックしたときにスクロール可能な長いフォームがありますが、エラーが発生したらスクロールする方法はありますか？

私はフォームを作成しました。今は40ポイントのリストがあります。いくつかのドロップダウン、いくつかのテキストボックス、いくつかのチェックボックスがあります。私も必須フィールドを作った。 しかし、ボタンが下部にあります。したがって、ユーザーがボタンをクリックして検証が行われた場合、エラーメッセージが表示され、自動的にスクロールするという機能を提供する必要があります。

どうすれば可能かわかりません。私は、ブートストラップデザインを使用してASP.NET Webサイトに取り組んでいます。

Answer 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; 
}