ピースペース

ASP.NET MVC + AJAX + 戻る

leave a comment »

Ajaxなページでブラウザの「戻る」の実現。を解説するページはいくつもあるが
ASP.NET MVCなAJAXと絡んだ説明となるとまず見つけられない。
この問題(Ajaxページで戻るボタン)に対処するjQueryプラグイン陣営からすれば、
サーバーサイドが、ASP.NET MVCなことはまったくの興味外だから当然といえば当然。

さて、MVCで、Ajaxヘルパーとunobtrusive-ajaxの組み合わせで
AjaxなScriptを1行もかかずにAjaxができている。これはこれで魅力なので
この挙動を変更せずに、「戻る」を可能にするScriptを「追加だけ」で実現できるか?が課題になる。
結論から言えば、これは可能。
を最初、むずかしく思ってしまったのは
「戻る」対処なプラグインが、この問題に対してどうゆう機能を追加で提供しているのか?
を理解できていなかったため。

この問題について、ほとんどのページには、
「URLのページ内アンカー(#****)を利用する」とだけ書かれていて、
あとは、jQueryプラグインのサンプルを確認してね。ほら、すごいよね→プラグイン!
って... なにが偉いのかわからねーー(T.T)

何が問題?で、どう対処するのか?に、こうゆう機能を追加したよ!
あたりのもう少し丁寧な説明があるとうれしい。
けど、「そんなこといちいち説明しなくても知っててあたりませでしょ!」的な
うえから目線が痛い(T.T)

で、一応、オラ的にまとめとく
AjaxなページでAjaxの前後で違うURLがブラウザ履歴に記録されるようにする必要がある。
Ajax動作に影響をあたえないようするため、それはURLのアンカー部分(location.hash)を編集することで行う。
このようにしてアンカーが追加されたページに戻る/進むで遷移してきたときに
アンカーに保存されている内容からAjax更新部分を再度復元する。

おらの場合は、この最後の「Ajax部分の復元が必要」をわかっていなくて
プラグインサンプルのコードが読めなかった。
たとえば、jQuery Address プラグインは、
・ ページURLにアンカーを追加する機能(address)
・ 戻る/進むでAjaxなページに遷移してきたときのイベント(change)
などの機能を追加している。
まで、理解して、サンプルのコードが読めるようになった。

Written by nasu38yen

2011年8月29日 @ 8:41 AM

コメントを残す

以下に詳細を記入するか、アイコンをクリックしてログインしてください。

WordPress.com ロゴ

WordPress.com アカウントを使ってコメントしています。 ログアウト / 変更 )

Twitter 画像

Twitter アカウントを使ってコメントしています。 ログアウト / 変更 )

Facebook の写真

Facebook アカウントを使ってコメントしています。 ログアウト / 変更 )

Google+ フォト

Google+ アカウントを使ってコメントしています。 ログアウト / 変更 )

%s と連携中

%d人のブロガーが「いいね」をつけました。