C# と VB.NET の質問掲示板

ASP.NET、C++/CLI、Java 何でもどうぞ

C# と VB.NET の入門サイト

Re[7]: GoogleCromeでのポストバック時のスクロール位置保持

(過去ログ 133 を表示中)

[トピック内 10 記事 (1 - 10 表示)]　 << 0 >>

■78342 / inTopicNo.1)

　GoogleCromeでのポストバック時のスクロール位置保持

▼■

□投稿者/ きゅう (4回)-(2016/01/08(Fri) 19:46:26)

分類:[.NET 全般]　

お世話になっております。

ASP.NET（C#） .NET Framework4.5でWebFormを作成しております。

pageディレクティブに「MaintainScrollPositionOnPostBack="true"」を設定して、
ポストバック時に、ポストバック前のスクロール位置に戻るようにしているのですが、
IEとFireFoxでは動作するのですが、GoogleCromeではスクロール位置が一番上に戻ってしまいます。

GoogleCromeに対応させることはできないのでしょうか？

やってみたことは、

http://www.remember-the-time.xyz/2012/06/aspnet-chrome-firefox.html
を参考にbrowserファイルを作成し、
<browser refid="Safari1Plus">
<capabilities>
<capability name="supportsMaintainScrollPositionOnPostback" value="true">
</capability></capabilities>
</browser>
を記述しましたが、.NET Framework2.0より上だと動かないようで、エラーとなってしまいました。

また、
自動生成されたページソースを見ると、「__SCROLLPOSITIONY」というIDのHiddenタグが生成されており、
それにポストバック前のScrollTop値が格納されているようでしたので、
$(window).loadイベントを使用して、
window.scrollTop = sampleElement.value;
を実行してみました。
結果、一度、指定されたスクロール位置に行くのですが、
その後、一番上にスクロールが戻されてしまいます。

自動生成されたページソースを見る限り、
$(window).loadイベント以降に実行しているスクリプトは見当たらないのですが
GoogleChromeの独自仕様とかでしょうか・・・

宜しくお願い致します。

引用返信 編集キー/

■78343 / inTopicNo.2)

　Re[1]: GoogleCromeでのポストバック時のスクロール位置保持

▲▼■

□投稿者/ WebSurfer (766回)-(2016/01/08(Fri) 21:00:44)

■No78342 (きゅうさん) に返信

Chrome のバージョンは？

引用返信 編集キー/

■78348 / inTopicNo.3)

　Re[1]: GoogleCromeでのポストバック時のスクロール位置保持

▲▼■

□投稿者/ WebSurfer (767回)-(2016/01/09(Sat) 13:39:30)

■No78342 (きゅうさん) に返信

> IEとFireFoxでは動作するのですが、GoogleCromeではスクロール位置が一番上に戻ってしまいます。

ASP.NET 4, Chrome の最新版 47.0.2526.106 m で試してみましたが、期待通りポストバック
前後でスクロール位置は維持されましたが？？？？

ちなみに、Firefox 43.0.4, Safari 5.1.7, Opera 12.17 でも試しましたが、同様にストバッ
ク前後でスクロール位置は維持されました。

html ソースを見てください、一番下の方に以下のようなスクリプトがインラインで含まれて
いませんか？

theForm.oldSubmit = theForm.submit;
theForm.submit = WebForm_SaveScrollPositionSubmit;

theForm.oldOnSubmit = theForm.onsubmit;
theForm.onsubmit = WebForm_SaveScrollPositionOnSubmit;

加えて、以下のような外部スクリプトファイルへの参照が含まれていませんか？

＜script src="/WebResource.axd?d=LeFq30..." type="text/javascript"＞＜/script＞

それらが存在すれば動くはずです。

それらがないとすると、ブラウザ判定の問題で ASP.NET がスクリプトを生成しないというこ
とが原因として考えられます。

・・・が、「.NET Framework4.5でWebFormを作成しております」というのが間違いなければ、
そういうことはなさそうです。ホントに ASP.NET 4.5 は間違いないのですか？

safari, chrome は ASP.NET 2.0, 3.0, 3.5 ではブラウザ定義に問題があるようです。詳しく
は以下の記事を見てください。

Safari は downlevel browser?
http://surferonwww.info/BlogEngine/post/2010/07/30/Safari-is-downlevel-browser.aspx

しかし、ASP.NET 4 の CONFIG\Browsers サブフォルダには safari.browser, chrome.browser
という専用のブラウザ定義ファイルがあり、正しくブラウザ判定がされますので、「.NET
Framework4.5でWebFormを作成しております」が間違いなければ、スクリプトが生成されない
という問題はないはずです。

ブラウザ定義ファイル
http://surferonwww.info/BlogEngine/post/2012/05/19/Web-custom-control-with-embedded-resources.aspx

HttpBrowserCapabilities オブジェクトを調べてみてはいかがですか？

また、ClientTarget を使って、問題の質問者さんの Chrome から要求をかけても、IE に
対する html ソースと同じものを返すように設定できますので、それで問題の切り分けが
できると思います。

ClientTarget の利用
http://surferonwww.info/BlogEngine/post/2014/06/14/settings-of-clienttarget-property.aspx

引用返信 編集キー/

■78349 / inTopicNo.4)

　Re[1]: GoogleCromeでのポストバック時のスクロール位置保持

▲▼■

□投稿者/ WebSurfer (768回)-(2016/01/09(Sat) 14:00:18)

■No78342 (きゅうさん) に返信

上のレスで紹介した「ブラウザ定義ファイル」の記事の URL が間違ってました。
以下の通り訂正します。

ブラウザ定義ファイル
http://surferonwww.info/BlogEngine/post/2014/03/04/browser-definition-files.aspx

引用返信 編集キー/

■78394 / inTopicNo.5)

　Re[2]: GoogleCromeでのポストバック時のスクロール位置保持

▲▼■

□投稿者/ ???イ (2回)-(2016/01/12(Tue) 15:24:15)

2016/01/12(Tue) 15:45:54 編集(投稿者)

すみません。名前が化けてしまいました。
「きゅう」です。

■No78349 (WebSurfer さん) に返信

回答ありがとうございます。

Chromeのバージョンは「47.0.2526.106 m (64-bit)」で最新となっています。
.NetFrameworkも、VisualStudioのプロジェクトプロパティで「対象となるFrameWork」が4.5となっており、
IISのアプリケーションプールもv4.0となっています。

WebSurfer さんの検証していただいた環境では、動作しているとのことですので、
ひとまず最小限のコードに削って試してみます。

引用返信 編集キー/

■78400 / inTopicNo.6)

　Re[3]: GoogleCromeでのポストバック時のスクロール位置保持

▲▼■

□投稿者/ ????C (1回)-(2016/01/12(Tue) 15:44:21)

2016/01/12(Tue) 15:46:54 編集(投稿者)

こちらも名前の文字化けに気づきませんでした。
「きゅう」です。

■No78349 (WebSurfer さん) に返信

すみません。漏れました。
自動生成のソースには、以下が存在してました。

一番下のほうに、
＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝
<script type="text/javascript">
//<![CDATA[

theForm.oldSubmit = theForm.submit;
theForm.submit = WebForm_SaveScrollPositionSubmit;

theForm.oldOnSubmit = theForm.onsubmit;
theForm.onsubmit = WebForm_SaveScrollPositionOnSubmit;

theForm.oldOnLoad = window.onload;
window.onload = WebForm_RestoreScrollPosition;
//]]>
</script>
＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝
があり、
外部ファイルの参照もbody内、上部にありました。
＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝
<script src="/vnavi3_test/WebResource.axd?d=pyn..." type="text/javascript"></script>
＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝

引用返信 編集キー/

■78406 / inTopicNo.7)

　Re[4]: GoogleCromeでのポストバック時のスクロール位置保持

▲▼■

□投稿者/ WebSurfer (775回)-(2016/01/12(Tue) 16:53:07)

■No78400 (????C さん) に返信

> 自動生成のソースには、以下が存在してました。

それらが生成されていれば問題なく動くはずなのですが。Chrome で動かないよ
うな特別なスクリプトではないですし。

スクリプトが動かない設定になっていませんか？

Chrome でもクライアントスクリプトのデバッグができるようなので、試してみ
てはいかがですか？

［その他のツール(L)］⇒［ディベロッパーツール(D)］でディベロッパーツール
が表示されたら Ctrl + P でリストを表示し、WebResource.axd をクリックする
と外部スクリプトのソースコードが表示されるはずです。

WebForm_SaveScrollPositionOnSubmit, WebForm_RestoreScrollPosition メソッ
ド内の最初の行にブレークポイントを設定してから画面をスクロールしてポスト
バックしてみてください。

引用返信 編集キー/

■78413 / inTopicNo.8)

　Re[5]: GoogleCromeでのポストバック時のスクロール位置保持

▲▼■

□投稿者/ きゅう (5回)-(2016/01/12(Tue) 19:18:47)

■No78406 (WebSurfer さん) に返信

WebSurferさん、
申し訳ありません。お伝えする情報が漏れておりました。そしてその漏れていた部分に原因がありました。
作成しているWebFormはマスターページ内のコンテンツページでして、
コンテンツページのPageディレクティブに「MaintainScrollPositionOnPostBack」を設定しておりました。

マスターページでは、cssファイルを読み込んでいるのですが、そのcssの中で
Bodyに「height」のスタイルを設定していたのがスクロール保持を邪魔していたようです。
コメントアウトしたらChromeでもスクロール位置の保持がされました。

マスターページのhead内の一番上でcssを読み込んでいるのですが、
出力ソースの下部にある、「スクロールをポストバック前の位置に戻すJavascript」が実行された後で、
cssでの「height」が設定されてスクロール位置がリセットされているという感じに受け取りましたが、
この順番が一般的なのでしょうか？
（イマイチ納得できないのですが・・・）

引用返信 編集キー/

■78422 / inTopicNo.9)

　Re[6]: GoogleCromeでのポストバック時のスクロール位置保持

▲▼■

□投稿者/ WebSurfer (776回)-(2016/01/13(Wed) 11:24:46)

■No78413 (きゅうさん) に返信
> ■No78406 (WebSurfer さん) に返信
>
> WebSurferさん、
> 申し訳ありません。お伝えする情報が漏れておりました。そしてその漏れていた部分に原因がありました。
> 作成しているWebFormはマスターページ内のコンテンツページでして、
> コンテンツページのPageディレクティブに「MaintainScrollPositionOnPostBack」を設定しておりました。
>
> マスターページでは、cssファイルを読み込んでいるのですが、そのcssの中で
> Bodyに「height」のスタイルを設定していたのがスクロール保持を邪魔していたようです。
> コメントアウトしたらChromeでもスクロール位置の保持がされました。

不思議な話ですね。そんなことはあり得ないと思うのですが・・・

念のため、自分でも body に height を適用する CSS を作っていろいろ試して
見ましたが「ポストバック前後でスクロール位置が維持できない」という問題は
再現できませんでした。

なお、マスターページにあろうがコンテンツにあろうが関係ないです。ASP.NET が
最終的に html ソースにレンダリングした時に隠しフィールド / スクリプトや
CSS がどうなっているかが問題ですよ。

> マスターページのhead内の一番上でcssを読み込んでいるのですが、
> 出力ソースの下部にある、「スクロールをポストバック前の位置に戻すJavascript」が実行された後で、
> cssでの「height」が設定されてスクロール位置がリセットされているという感じに受け取りましたが、
> この順番が一般的なのでしょうか？
> （イマイチ納得できないのですが・・・）

ASP.NET が生成するインラインスクリプトで、

window.onload = WebForm_RestoreScrollPosition;

となっているのは確認しましたよね。なので、CSS を読んだ後になるはずです。

というか、そもそも CSS は関係ないと思いますし、実際どのように設定しても
当方では問題は再現できませんでした。

回答者の方でもコピペすれば問題を再現できる必要最小限の .aspx ソースを
アップしていただけませんか？

引用返信 編集キー/

■78750 / inTopicNo.10)

　Re[7]: GoogleCromeでのポストバック時のスクロール位置保持

▲▼■

□投稿者/ きゅう (6回)-(2016/02/15(Mon) 11:10:57)

■No78422 (WebSurfer さん) に返信

すみません。遅くなりました。

最小コードで試してみましたが、再現しませんでした。

何かheightが影響するようなプロジェクトレベルでの設定とかあるのでしょうか・・・
あとは、他のコードとの組み合わせで発生するとかですかね。

今回、最小コードにするにあたって、ざっくりと削っていってしまったので、
時間が取れたら、もう少し細かい単位でコードを削っていって原因箇所を特定したいと思います。

引用返信 編集キー/

トピック内ページ移動 / << 0 >>

このトピックに書きこむ

過去ログには書き込み不可

- Child Tree -