Question

我很难弄清楚如何让AJAX在MVC3中使用子操作。我有一个包含由子操作呈现的部分的视图。该子操作呈现部分视图，其中包含分页列表。我需要这样做，以便当用户点击页面列表寻呼机上的另一个页码时，只会更新包含视频列表的视图的bottem部分。我已经包含了我的代码，并且非常感谢一些帮助，因为我仍然对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>

Answer 1

您可能想要做的是在main-content div之后插入一个AjaxForm，并在main-content div关闭之前结束它。

然后PagedListPager可以提交给控制器中的Json方法，该方法将返回要更新的Ajax表单的内容（例如视频列表）。

MVC3 Ajax ChildAction

1 个答案: