0

ASP MVC 開発はまだ初心者です。List (すべてのアーティストのリストを表示) と Highlights (すべての詳細を含む 3 つの特定のアルバムを表示) の 2 つのビューを持つ MusicController があるとします。

両方のビューを 1 つのページにレンダリングしたいと考えています。1) これを行う最善の方法は何ですか? 部分ビュー?両方の部分ビューを表示するページ用に別のコントローラーを作成する必要がありますか? 2) 選択したアーティストに基づいてハイライトを変更したいとします。そのパラメーターをハイライト付きの部分ビューに渡す方法は?

いくつかのリードを教えてくれてありがとう!

4

3 に答える 3

4

部分的なビューは確かにあなたが望むものです。発生する可能性のある問題の1つは、スタンドアロンとして機能し、別のビューに埋め込まれた部分ビューを作成するのが難しい場合があることです。解決策は、(単一の)部分ビューを呼び出す必要なすべての定型文を含む別のビューを作成することです。その場合、部分ビューは、個々のページと結合されたページの両方で使用するのに適しています。

集約ビューに個別のコントローラーは必要ありませんが、独自のアクションが必要になります。

これが私が提唱している構造です:

MusicController

public ActionResult List() {
  return View();
}
public ActionResult Highlights() {
  return View();
}
public ActionResult ListAndHighlights() {
  return View();
}

のビューListHighlightsは次のようになります。

<div class="anyNecessaryChrome">
  @RenderPartial( "ListPartial" )
</div>

そして、ListAndHighlights()次のようになります。

<div class="listChrome">
  @RenderPartial( "ListPartial" )
</div>
<div class="highlightsChrome">
  @RenderPartial( "HighlightsPartial" )
</div>

クライアント側の何かに応じて部分ビューを更新する場合は、AJAXを使用する必要があります。

于 2012-05-23T21:17:14.467 に答える
1

を見てHtml.RenderAction()Html.RenderPartial()

または、アーティストのリストをビューとして取得し、AJAX を使用してハイライトをロードします。

そのために必要なのは2つのアクションメソッドだけです

public class ArtistsController {
    public ActionResult Index() {
        return View();
    }
}

public class AlbumsController {
    [HttpGet]
    public JSONResult GetHighlights(int artistId) {
        return JSON(Albums.GetHighlights(artistId), JsonRequestBehavior.AllowGet);
    }
}

いくつかのサンプル HTML

<ul id="artists">
   <li><a href="#" data-artist-id="1">Michael Jackson</a></li>
   <li><a href="#" data-artist-id="2">Tom Jones</a></li>
</ul>

次に、jQuery を使用して Highlights アクション メソッドを呼び出すことができます。$.get

$("#artists a").click(function(e) {
    var id = $(this).data("artist-id");
    $.get("/Albums/GetHighlights/" + id, function(data) {
        // Populate highlights section with data from server
    });
});
于 2012-05-23T21:11:28.777 に答える
0

アーティストのリストとアルバムのリストを格納するViewModelを作成できます

public class ArtistWithHighlights
{
  public Artist Artist { set;get;}
  public IEnumerable<Albums> Albums{ set;get;}
}

そしてControllerllerにGETビューのアクションメソッドを記述します。Get all Artists と Get the Albums では、最初の Artist に属します。(これは、要件に応じて変更できます)

public ActionResult ArtistsWithHighLights()
{
  List<ArtistWithHighlights> allArtists=new List<ArtistWithHighlights>();
  allArtists=GetAllArtists();

  //If we have atlease one artist in the list, Load the albums for the first one only
  if(allArtists.Count>0)
  {
     allArtists[0].Albums=GetAlbumsForArtist(allArtists[0].Artist.ArtistID);
  }    
  return View(allArtists);       
} 

強く型付けされたビューは次のようになります

@model List<ArtistWithHighlights>

@foreach(var artist in Model)
{
  <a id="@artist.ID" class="artistName">@artist.Name</p>
}
<div id="albums">
  <h3>Highlighted Albums</h3>
  @foreach(var album in Model[0].Albums)
  {
     <p>@album.Name</p>
  }
</div>

別のアーティストのアルバムを選択 (クリック イベント) で取得するにActionは、渡されたアーティスト ID のアルバムのリストを返す別のメソッドに ajax 呼び出しを行い、それを div に表示できます。

$(function(){
 $(".artistName").click(function(e){
  e.preventDefault();
   var  artistId=$(this.attr("id");
     $("#albums").load("../Albums/"+artistId);
  });
});
于 2012-05-23T21:26:12.757 に答える