メニューオプションの左側と右側の内容の修正メニューをクリックします。MVCをクリックします

Question

ユーザーがアプリケーションにログインし、メニューのいずれかをクリックすると、左サイドメニューで最初に読み込まれるMVCアプリケーションを作成していますオプションのみ右側のコンテンツが表示されます（アクションメソッドを呼び出します）。

私はパーシャルビューを使用してそれを達成しました。パーシャルビューでアプリケーション全体を作成するのは良いことですか、これを実現する他の方法はありますか？

Answer 1

リンクがクリックされたページを非同期でロードするように見えます。 jQueryのajaxメソッドを使用してこれを行うことができます。

最初に、リンクをCSSクラス名でマークして、jQueryセレクタとしてリンクを使用して、ajaxfiedロード動作を配線します。また、ajax呼び出しの結果をロードするコンテンツページも必要です。

<div> 
    <div id="leftPane"> 
    <a href="@Url.Action("About","Home")" class="alink">About</a> 
    <a href="@Url.Action("Contact","Home")" class="alink">Contact</a> 
    <a href="@Url.Action("Index","Home")" class="alink">Index</a> 
    <div> 
    <div id="rightPane"> 
    </div> 
</div> 

今、あなたはそれらのアクションメソッドの内容を取得し、適切なCSSで右側のペインのinnerHTMLの

$(function(){ 

    $("a.alink").click(function(e){ 
    e.preventDefault(); 
    $("#rightPane").load($(this).attr("href")); 
    }); 

}); 

を更新するために、jQueryのloadメソッドを使用して、これらのリンクをクリックしてイベントを聞くことができ、あなたが保つことができますleftPaneをコンテナの左側に、rightPaneを右側に移動します。