2

AJAXをMVC3の子アクションで動作させる方法を理解するのに苦労しています。子アクションによってレンダリングされたセクションを含むビューがあります。その子アクションは、ページリストを含む部分ビューをレンダリングします。ユーザーがページリストページャーの別のページ番号をクリックしたときに、ビデオのリストを含むビューの下部のみが更新されるようにする必要があります。私は自分のコードを含めましたが、MVC3がAJAXと連携する方法のいくつかについてまだ混乱しているので、助けていただければ幸いです。前もって感謝します。

私の見解：

    @model UltimateGameDB.Domain.Entities.Video
    @{
        ViewBag.Title = "Video Home";
        Layout = "~/Views/Shared/_Layout.cshtml";
    }
    @using PagedList
    @using PagedList.Mvc

    @section MainBanner {
        <section id="videos-featured">
            @Html.Partial("_Video", Model)

            <div id="videos-featured-detail">
                @Html.Partial("_VideoDetail", Model)

                @Html.Action("MiniFeaturedVideo", "Video") 
            </div>
        </section>
    }

    @Html.Action("RecentVideos", "Video", new { page = ViewBag.page })

私のコントローラーメソッド：

  public ActionResult VideoHome(Guid? selectedVideoId, int? page)
  {
     var pageIndex = page ?? 1;
     ViewBag.page = pageIndex;

     if (selectedVideoId == null)
     {
        selectedVideoId = ugdb.Videos.Where(v => v.IsFeatured == true).OrderBy(v => v.Timestamp).FirstOrDefault().VideoID;
        ViewBag.Autoplay = 0;
     }
     else
     {
        ViewBag.Autoplay = 1;
     }

     return View(ugdb.Videos.Find(selectedVideoId));
  }

  [ChildActionOnly]
  public ActionResult RecentVideos(int? page)
  {
     IQueryable<Video> videoList = ugdb.Videos.OrderBy(v => v.Timestamp);

     var pageIndex = page ?? 1;
     var onePageOfVideos = videoList.ToPagedList(pageIndex, 8);
     ViewBag.OnePageOfVideos = onePageOfVideos;

     return PartialView("_RecentVideos");
  }

私の部分的な見方：

    @using PagedList
    @using PagedList.Mvc

    <div id="main-content" class="videos">
        <section>
            <a class="body-title"><span>RECENT VIDEOS</span><span class="title-arrow"></span></a>
            <div class="main-hr"></div>
            @foreach (var video in ViewBag.OnePageOfVideos)
            {
                <a class="video-entry" href="@Url.Action("VideoHome", "Video", new { selectedVideoId = video.VideoID })">
                    <img src="http://img.youtube.com/vi/@video.YouTubeID/default.jpg" alt="@video.VideoName" />
                    <div class="video-details">
                        <h2>@video.VideoName</h2>
                        <p>@video.VideoType</p>
                    </div>
                </a>
            }        
        </section>
        <div class="pagination">
            @Html.PagedListPager((IPagedList)ViewBag.OnePageOfVideos, page => Url.Action("VideoHome", "Video", new { page = page }), PagedListRenderOptions.OnlyShowFivePagesAtATime)
        </div>
    </div>
4

1 に答える 1

1

おそらくやりたいことは、divの後にAjaxFormを挿入し、 divが閉じるmain-content前に終了することです。main-content

次に、PagedListPagerコントローラーのJsonメソッドに送信すると、Ajaxフォームのコンテンツ（動画のリストなど）が返され、更新されます。

于 2012-08-04T03:46:31.303 に答える