AJAX 呼び出しを使用して部分ビューを要求し、その html をメインのインデックス ビューのコンテンツ領域に読み込みます。URL へのハッシュを利用して、ブラウザー履歴のサポートを有効にしています (GMail の URL ブラウザー履歴と同じように)。
私の部分的なビューが返されてロードされた後を除いて、すべてが正常に機能しています。
メインビューにリクエストを開始するリンクがあります:
<div class="linkButton" data-bind="click:function(){Nav.makeRequest('#/MyController/Profile/2')}">Profile</div>
部分ビューをリクエストしてロードするために使用しているJavaScriptは次のとおりです。
var Nav:function(){
var self = this;
$(window).bind("hashchange", self.onHashChange);
makeRequest: function(hash){
window.location.hash = hash;
};
onHashChange: function (e) {
var hash = window.location.hash.substring(1);
var url = 'http://localhost:3333/' + hash.substring(1);
$.get(url, function (data) {
$('#content').html(data);
});
}
}
したがって、私のリクエスト例の 1 つは次のようなものです。http://localhost:3333/#/MyController/Profile/2
リクエストが正常に完了し、ルーティングで渡された id ( 2 )の正しいモデルがプロファイル ビューに読み込まれ、ブラウザのナビゲーションの URL が上に表示されます。
ただし、ビューの読み込みが完了すると、ブラウザーの URL は自動的に次のように変更されます。http://localhost:3333/#
これは、ページに現在読み込まれているものには影響しませんが、この新しい URL がブラウザーの履歴に追加されるため、[戻る] ボタンを押すと、部分的なプロファイル ビューの要求が再度送信されます。
Global.axax にある唯一のルートは次のとおりです。
routes.MapRoute(
"Default", // Route name
"{controller}/{action}/{id}",
new { controller = "MyController", action = "Index", id = UrlParameter.Optional }
);
MVC ルーティング エンジンは、部分ビューのリクエストが ( http://localhost:3333/MyController/Profile/2
) に入ってきたことを確認し、インデックス ビューの URL を返すデフォルト ルートと照合するのではないかと考えています。http://localhost:3333/
私はクライアントで広範囲にデバッグしましたが、onHashChange イベントは実際に、部分ビュー要求に対して 1 回、URL が localhost:3333/# に戻ったときに 2 回発生します。呼び出しスタックは、クライアント側で行われている呼び出しを明らかにしません。 URLが元に戻るようにします。
AJAX と履歴サポート用のハッシュを使用して部分ビューを要求してロードし、ブラウザの URL をデフォルトのルート パスに自動的に戻さないようにする方法はありますか?