vendredi 8 mai 2015

Pagination inside Partials with Parent Model Data

I have a ticket model called 'Ticket' that has a collection of Comments of type Comment (Model).

I want to display the Ticket details with a list of comments. I want the list to be pageable using PagedList.Mvc. I want to be able to page through the comments while not impacting the Ticket Details or refreshing the ticket details view.

I think the best approach (?) would be to have a partial view of comments where I can set up the paging on the partial view so that only the comments page.

Inside my Layout I 'RenderBody()' the TicketDetails.cshtml View

@model DearSanta.Models.Ticket
 <div class="row">
<div class="col-md-4">
    <h4 class="col-md-4"><strong>Project Name:</strong> </h4>
    <h4>@Model.Project.Name</h4>
    ...//Other properites of the ticket here
</div>
<div class="col-md-4">
    @Html.Partial("GetComments", Model.Comments)
</div>

My Partial View for Comments: _GetComments.cshtml

@model  PagedList.IPagedList<DearSanta.Models.TicketComment>
@using PagedList.Mvc;

@section CSS{
<link href="~/Content/PagedList.css" rel="stylesheet" type="text/css">
}

<h4 class="title">Ticket Comments</h4>

<ul class="timeline">
@foreach (var c in Model)
{

    <li>
        <i class="fa fa-comment"></i>
        <span class="date">@c.CreateDate.ToString("d MMM")</span>
        <div class="content">
            <p><strong>@c.User.DisplayName</strong> @c.Comment</p>
            <small>@Convert.ToInt32(((DateTime.Now -     c.CreateDate).TotalDays)) days ago</small>
        </div>
    </li>

}
  </ul>
 <div>
  Page @(Model.PageCount < Model.PageNumber ? 0 : Model.PageNumber) of    @Model.PageCount
@Html.PagedListPager(Model, page => Url.Action("Index", new { page }))
</div>

My Controller for the Partial: GetDetails (The original view is served up by a basic 'Details' controller for Tickets. e.g. return View(db.Tickets.Find(id))

public PartialViewResult GetComments(TicketComment model, int page=1)
    {

        int pageSize = 3; // three comments at a time on this page
        int pageNumber = page;

        var comments = model.ToPagedList(page, pageSize);

        return PartialView("GetComments", comments);
    }

I know I'm close but I can't seem to get it to work. Any help is much appreciated as I've never implemented Partials before.

Aucun commentaire:

Enregistrer un commentaire