MVC3 - 同じページにpartialviewを表示

Question

私のページには左側のナビゲーションメニューがあります。以下のようなurl.actionを使用しています。私はすぐ隣のビュー（メニューの右側）をリンクがクリックされた..私は、私はこれを持ってナビゲーションメニューの隣のdivに入れ..しかし、そのdivの中に適切な内容を表示する方法が分からない...コントローラで

<table> 

<tr><td><a href='@Url.Action("ActionName1", "ControllerName")'> 
<img src='@Url.Content("~/Content/themes/base/images/image1.png")'/></a></td></tr> 

<tr><td><a href='@Url.Action("ActionName2", "ControllerName")'> 
<img src='@Url.Content("~/Content/themes/base/images/image2.png")'/></a></td></tr> 


</table> 
<div id="DISPLAYVIEWHERE">DISPLAY VIEW HERE based on link that is clicked</div> 

、ActionName1コード..

public ActionResult ActionName1() 
    { 
     var model = new ViewModel(); 
     return PartialView("PartialView1", model);  
    } 

これを実行すると、partialview1が新しいページで開かれます。この部分的なビューを、ナビゲーションメニューと同じページで、すぐにメニューの右側に開くことができます。どのリンクをクリックするかに基づいて、partialview1またはpartialview2がナビゲーションメニューの隣に表示されます。助けて。

Answer 1

この場合、ajaxを使用する必要があります。あなたは

<a class='handle' href='@Url.Action("ActionName1", "ControllerName")'> 
<img src='@Url.Content("~/Content/themes/base/images/image1.png")'/></a> 
<a class='handle' href='@Url.Action("ActionName2", "ControllerName")'> 
<img src='@Url.Content("~/Content/themes/base/images/image2.png")'/></a> 

のようなあなたのアンカータグにいくつかのクラスを追加することができ、その後、あなたはあなたがにAJAXを使用する必要がjqueryのを使用して、これらのリンクのクリックイベントをフックし、

$('.handle').live('click', function(){ 
     $.ajax({ 
      url:this.href, 
      type='post', 
      success:function(data) 
      { 
       //data contains the result returned by server you can put it in div here 
       $('#DISPLAYVIEWHERE').html(data); 
      } 
      }); 
//here you have to return false to prevent anchor from taking you to other page 
return false; 
    });