動的に作ったスクロールのポジションを保存したいです。

環境/言語:[WindowsXP, SQLServer2008, VisualStudio2008, VB]
分類:[ASP.NET]

皆様、

いつもお世話になります。
ASP.NETが初めてなのでいろいろ掲示板で勉強しながら小さいプロジェクトを進めているのですが、
スクロールの画面がいつも初期表示になって困っています。
現在、作成している画面はエクセルのようにユーザさんが自由に横、縦の項目を追加したり削除することができる仕様になっています。

そのために、以下のように画面上ではTableだけ設定しておいて

<div id="divTest" class="ViewTable" style="width:1170px; overflow-x:scroll; overflow-y:hidden">

<asp:Table ID="Table_header" runat="server">
</asp:Table>
<div class ="MainView" style="height:460px; overflow-y:scroll; overflow-x:hidden">
<asp:Table ID="Table_body" runat="server">
</asp:Table>
</div>

</div>

VB側でTable_body.Rows.Add(TableCellを設定したTableRow)　で動的に項目を設定しています。
データの更新や登録処理の後、スクロールを処理前の位置にしてほしいですが、いつも最初のところに戻ってしまいます。
GridViewなどの静的な画面の対応方法については参考資料がありましたが、今回のように動的なスクロールはどう対処すべきなのかよくわからないです。
ボタンをクリックする際に、
【scriptで現在のスクロールの位置を取得し、画面の非表示フォームに格納、処理が終わってから画面を表示する際に非表示フォームを参考にしてスクロールを処理前に戻す】という流れでなんとかなるのかなと思いますが、なかなかうまくいきません。

上記のような流れって合ってますでしょうか。他に簡単な処理方法はありますでしょうか。是非教えて頂ければ幸いです。

よろしくお願い致します。

■No28288に返信(ばえさんの記事)
> GridViewなどの静的な画面の対応方法については参考資料がありましたが、今回のように動的
> なスクロールはどう対処すべきなのかよくわからないです

VB.NET で Table に TableRow を追加するのであれば Table に TableRow を追加する処理
はサーバー側で行われます。クライアント側から見ると Table コントロールも
GridView コントロールも HTML Table Element として認識されます、どちらも静的です。
GridView コントロールが暗黙的におこなう行の追加を Table コントロールで明示的に記述するわけです
ので、静的と動的の対比よりは暗黙と明示の対比が近いのではないかと思います。
ばえさんがお調べになった方法がどのようなものかわかりませんが GridView の対応方法をその
まま適用できないでしょうか。

コードを拝見すると div のスクロールポジションを保存したいということですかね。

もりおさん、
ご回答ありがとうございます。
そうですね、クライアント側からみると確かに両方とも静的に見えますね。
GridViewの対応方法でじっくり調べていろいろ試したところ、解決することができました！

まず、画面側（****.aspx）でscriptでCookieにスクロールの位置や指定したポジションを格納する処理を設定しました。

<script>
-> 画面を表示する際にCookieに保存されているポジションにスクロールを移動する処理
window.onload = function(){

var strCook = document.cookie;
if(strCook.indexOf("!~")!=0){
var intS = strCook.indexOf("!~");
var intE = strCook.indexOf("~!");
var strPosX = strCook.substring(intS + 2, intE);

intS = strCook.indexOf("&~");
intE = strCook.indexOf("~&");
var strPosY = strCook.substring(intS + 2, intE);

divHeader.scrollLeft = strPosX
divMain.scrollTop = strPosY

return false;

}
}

-> divHeaderの横とdivMainの縦スクロールの位置をCookieに保存する処理
function SetDivPositionScroll() {
var intX = document.getElementById("divHeader").scrollLeft;
var intY = document.getElementById("divMain").scrollTop;
document.title = intX;
document.cookie = "Pos=!~" + intX + "~!**&~" + intY + "~&";
}

-> 初期位置をCookieに保存する処理
function SetDivPositionZero() {
var intX = 0;
var intY = 0;
document.title = intX;
document.cookie = "Pos=!~" + intX + "~!**&~" + intY + "~&";
}

-> 横：初期位置、縦：divMainの一番下の位置をCookieに保存する処理
function SetDivPositionYMax() {
var intX = 0;
var intY = document.getElementById("divMain").scrollHeight;
document.title = intX
document.cookie = "Pos=!~" + intX + "~!**&~" + intY + "~&";
}
</script>

処理を行うボタンのonclientclick属性に上記のscript処理を呼び出しました。

<asp:Button ID="btn_main" runat="server" Text="メイン画面へ" Height="30px"
Width="100px" onclientclick="SetDivPositionZero();" />
&nbsp;&nbsp;
<asp:Button ID="btn_add" runat="server" Text="行の追加" Height="30px"
Width="100px" onclientclick="SetDivPositionYMax();" />


参考にしたサイト：
http://radio.javaranch.com/pascarello/2005/01/09/1105293729000.html
http://radio.javaranch.com/pascarello/2005/07/18/1121709316718.html

先週末からこの処理ができなくて苦労していたので、解決できたようで本当にうれしいです。
ありがとうございました！！