Skip to main content

A DD4T.net Implementation - Pagination (Views)

In previous post Pagination (Models), I presented a way of modeling the server-side code to display dynamic lists of Dynamic Component Presentations (DCP) using AJAX.

In this post, I present the server-side view logic in context of MVC .net architecture and using Razor CSHTML views.

As presented in the previous post, the Controller creates a model class that contains the paginated list, and it then attaches this model to the ViewBag. In the example it was DeviceController, that created model DocumentPartial which contained a paginated list of documents.

We now need to display this list of paginated items in a Razor view. In order to make the logic reusable and succinct, I implemented the paginated view as partial view. The Component view corresponding to the controller includes the partial view and passes to it the model previously saved in the ViewBag. This makes the partial view generic and reusable from other contexts.

To continue our earlier example, the view corresponding to DeviceController is Device.cshtml and contains roughly the code below. The idea is to first check wether the ViewBag contains our model and if so, then call the partial view _PartialDocument.cshtml with the DocumentPartial model.

@model Device

<!-- markup goes here -->

@if (ViewBag.DocumentPartial != null)
{
    @Html.Partial("_PartialDocument", (DocumentPartial)ViewBag.DocumentPartial)
}

<!-- more markup here -->

The main view logic is contained in the partial view. In our example, _PartialDocument.cshtml, processes the PagedItems property and displays the items in that list according to some input parameters. The input parameters can be the current page to display (the page number) or the page size (the number of items per page). Additionally, the partial view displays some kind of page iterator that allows for navigation between pages of items (such as next page, previous page, or jumping to a specific page number). The outline of the Razor partial code is shown below:

@model DocumentPartial
@using PagedList.Mvc;

<div class="paged-section">
    Viewing @Model.PagedItems.Count of @Model.PagedItems.TotalItemCount documents

    @if (Model.IsPostback)
    {
        foreach (Asset asset in Model.PagedItems)
        {
            //Display logic goes here
        }

        <div>
            Page @(Model.PagedItems.PageCount < Model.PagedItems.PageNumber ?
                0 : Model.PagedItems.PageNumber)
            of @Model.PagedItems.PageCount
        </div>

        @Html.PagedListPager(Model.PagedItems, pageNumber => Model.GetPagerUrl(pageNumber))
    }
</div>

Note the usage of the Html.PagedListPager -- this extension method provided by PagedList.Mvc will generate a page iterator similar to the one below:

<div class="pagination-container">
    <ul class="pagination">
        <li class="active"><a>1</a></li>
        <li><a href="http://my.server.com/Device/Index/123/456/Device/_PartialDocument/2.ajax">2</a></li>
        <li><a href="http://my.server.com/Device/Index/123/456/Device/_PartialDocument/3.ajax">3</a></li>
        <li><a href="http://my.server.com/Device/Index/123/456/Device/_PartialDocument/4.ajax">4</a></li>
        <li><a href="http://my.server.com/Device/Index/123/456/Device/_PartialDocument/5.ajax">5</a></li>
        <li><a href="http://my.server.com/Device/Index/123/456/Device/_PartialDocument/6.ajax">6</a></li>
        <li><a href="http://my.server.com/Device/Index/123/456/Device/_PartialDocument/7.ajax">7</a></li>
        <li><a href="http://my.server.com/Device/Index/123/456/Device/_PartialDocument/8.ajax">8</a></li>
        <li><a href="http://my.server.com/Device/Index/123/456/Device/_PartialDocument/9.ajax">9</a></li>
        <li><a href="http://my.server.com/Device/Index/123/456/Device/_PartialDocument/10.ajax">10</a></li>
        <li class="disabled PagedList-ellipses"><a>&#8230;</a></li>
        <li class="PagedList-skipToNext"><a href="http://my.server.com/Device/Index/123/456/Device/_PartialDocument/2.ajax" rel="next">»</a></li>
        <li class="PagedList-skipToLast"><a href="http://my.server.com/Device/Index/123/456/Device/_PartialDocument/23.ajax">»»</a></li>
    </ul>
</div>

In the next post Pagination (AJAX), I present the client-side Javascript solution that calls these server-side components and that completes the pagination topic.


Comments

Popular posts from this blog

Running sp_updatestats on AWS RDS database

Part of the maintenance tasks that I perform on a MSSQL Content Manager database is to run stored procedure sp_updatestats . exec sp_updatestats However, that is not supported on an AWS RDS instance. The error message below indicates that only the sa  account can perform this: Msg 15247 , Level 16 , State 1 , Procedure sp_updatestats, Line 15 [Batch Start Line 0 ] User does not have permission to perform this action. Instead there are several posts that suggest using UPDATE STATISTICS instead: https://dba.stackexchange.com/questions/145982/sp-updatestats-vs-update-statistics I stumbled upon the following post from 2008 (!!!), https://social.msdn.microsoft.com/Forums/sqlserver/en-US/186e3db0-fe37-4c31-b017-8e7c24d19697/spupdatestats-fails-to-run-with-permission-error-under-dbopriveleged-user , which describes a way to wrap the call to sp_updatestats and execute it under a different user: create procedure dbo.sp_updstats with execute as 'dbo' as

Content Delivery Monitoring in AWS with CloudWatch

This post describes a way of monitoring a Tridion 9 combined Deployer by sending the health checks into a custom metric in CloudWatch in AWS. The same approach can also be used for other Content Delivery services. Once the metric is available in CloudWatch, we can create alarms in case the service errors out or becomes unresponsive. The overall architecture is as follows: Content Delivery service sends heartbeat (or exposes HTTP endpoint) for monitoring Monitoring Agent checks heartbeat (or HTTP health check) regularly and stores health state AWS lambda function: runs regularly reads the health state from Monitoring Agent pushes custom metrics into CloudWatch I am running the Deployer ( installation docs ) and Monitoring Agent ( installation docs ) on a t2.medium EC2 instance running CentOS on which I also installed the Systems Manager Agent (SSM Agent) ( installation docs ). In my case I have a combined Deployer that I want to monitor. This consists of an Endpoint and a

Debugging a Tridion 2011 Event System

OK, so you wrote your Tridion Event System. Now it's time to debug it. I know this is a hypothetical situtation -- your code never needs any kind of debugging ;) but indulge me... Recently, Alvin Reyes ( @nivlong ) blogged about being difficult to know how exactly to debug a Tridion Event System. More exactly, the question was " What process do I attach to for debugging even system code? ". Unfortunately, there is no simple or generic answer for it. Different events are fired by different Tridion CM modules. These modules run as different programs (or services) or run inside other programs (e.g. IIS). This means that you will need to monitor (or debug) different processes, based on which events your code handles. So the usual suspects are: dllhost.exe (or dllhost3g.exe ) - running as the MTSUser is the SDL Tridion Content Manager COM+ application and it fires events on generic TOM objects (e.g. events based on Tridion.ContentManager.Extensibility.Events.CrudEven