テーブルの自動スクロール

Question

こんにちは。
JavaScriptでテーブルの自動スクロールを実現させたいのですがどのようにすればよいでしょうか？
以下のように記述しましたがスクロールはしませんでした。

function test(i)
{
    var table = document.getElementId('GridView1');
    var tr = table.getElementsByTagName('tr')[i];
    var scrollTo = tr.offsetTop;
    table.scrollTop = scrollTo;
}

Comments

[m.ts10806]

現在の質問内容では要件が伝わりにくく回答が得られにくいように思います。質問テンプレートをご活用ください。https://teratail.com/help/question-tips#questionTips3-8

[m.ts10806]

何かしらhtmlの要素を取得されてますね。htmlも提示ください。また、test(i)の呼び出し元が分かるコードもご提示ください。

Answer 1

getElementByIdの書き損じだと思います。

<input type="number" value="0" min="0" onchange="test(this.valueAsNumber);" />
<div id="GridView1">
 <table>
  <tbody>
   <tr><td>0</td></tr>
   <tr><td>1</td></tr>
   <tr><td>2</td></tr>
   <tr><td>3</td></tr>
   <tr><td>4</td></tr>
  </tbody>
 </table>
</div>

#GridView1 {
  max-height: 3em;
  overflow-y: scroll;
}

document.getElementId = document.getElementById;

Comments

[tryCSharp]

すみません。スマホから投稿したので書き損じました。実際はVisual StudioでコーディングしているのでgetElementByIdと記載しています。tableにスクロールバーを付けたのですがdivタグで囲まないと上手くいきませんか…

[x_x]

displayを変更していたりするんですかね？
どちらでもいいと思いますが、問題があるコードがなければ原因はわからないかと

Answer 2

人のコードをコピペしていたの自分のテーブル構成に合っていないコードになっていました。
見直したところtbodyにスクロールがつけてあったので以下のコードで上手くいきました。

function test(i)
{
    var table = document.getElementById('GridView1');
    var tbody = table.getElementsByTagName('tbody');
    var tr = tbody[0].getElementsBytagName('tr')[i]
    var scrollTo = tr.offsetTop;
    tbody[0].scrollTop = scrollTo;
}