Creating a ViewModel

Here I am creating a ViewModel named PageInfo which contains Paging information.

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
 
namespace SportsStore.WebUI.Models
{
    public class PageInfo
    {
        public int TotalItems { get; set; }
        public int ItemsPerPage { get; set; }
        public int CurrentPage { get; set; }
 
        public int TotalPages
        {
            get
            {
                return (int)Math.Ceiling((decimal)TotalItems / ItemsPerPage);
            }
        }
    }
}

After creating PageInfo view model we need to create PagingHelper class. ‘Paging Helper’ class work as an extension method for ASP.NET MVC so that it needs to be static.

Creating PagingHelper extension method

Here I am creating PagingHelper extension method.

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.Mvc;
using SportsStore.WebUI.Models;
using System.Text;
 
namespace SportsStore.WebUI.HtmlHelpers
{
    public static class PagingHelpers
    {
        /// <summary>
        /// This method returns an MVCHtmlString which
        /// is used for Paging purpose. this represents
        /// that it is an extension method, PageInfo is a
        /// ViewModel class which I had created and pageUrl
        /// is anomyous type function.
        /// </summary>
        public static MvcHtmlString PageLinks(this HtmlHelper html, PageInfo pageInfo, Func<int, string> pageUrl)
        {
            //Create an object of StringBuilder class
            StringBuilder result = new StringBuilder();
 
            for (int i = 1; i <= pageInfo.TotalPages; i++)
            {
                //TagBuilder class is used to create Tag.
                //Here I am creating <a></a> tag.
                TagBuilder tag = new TagBuilder("a");
 
                //Merge required attributed like href, title etc.
                tag.MergeAttribute("href", pageUrl(i));
 
                //Set inner heml.
                tag.InnerHtml = i.ToString();
 
                if (i == pageInfo.CurrentPage)
                {
                    //Add any class if you want to add.
                    tag.AddCssClass("selected");
                }
 
                //Finally add resulted string in StringBuilder object.
                result.Append(tag.ToString());
            }
 
            //Create MVCHtmlString.
            return MvcHtmlString.Create(result.ToString());
        }
    }
}

Now I am going to use this extension method in our view to create Paging

Using PagingHelper extension method

<div class="pager">
    @Html.PageLinks(Model.PageInfo, x => Url.Action("List", new { page = x }))
</div>

Now after executing current application output will be as follows.

Note: This is not complete example. Here I am trying to tell that how to use extension method to create HtmlHelper and how to create Paging. If you copy and paste above code then it will not work.

Thanks for reading this article. Please write your valuable comments.