How can I modify this to have a Google-like paging? <p>My controller class contains</p> <pre><code>var Paged = new PaginatedList&lt;Products&gt;(SideBar, page ?? 0, pageSize); if (Request.IsAjaxRequest()) { return PartialView("~/Views/Shared/_Grid.cshtml", Paged); } return View(Paged); </code></pre> <p>the PaginatedList is</p> <pre><code>public class PaginatedList&lt;T&gt; : List&lt;T&gt; { public int PageIndex { get; private set; } public int PageSize { get; private set; } public int TotalCount { get; private set; } public int TotalPages { get; private set; } public PaginatedList(IQueryable&lt;T&gt; source, int pageIndex, int pageSize) { PageIndex = pageIndex; PageSize = pageSize; TotalCount = source.Count(); TotalPages = (int)Math.Ceiling(TotalCount / (double)PageSize); this.AddRange(source.Skip(PageIndex * PageSize).Take(PageSize)); } public bool HasPreviousPage { get { return (PageIndex &gt; 0); } } public bool HasNextPage { get { return (PageIndex + 1 &lt; TotalPages); } } } </code></pre> <p>And my view is</p> <pre><code>&lt;div class="pagination-container"&gt; &lt;nav class="pagination"&gt; &lt;ul&gt; @for (int i = 0; i &lt; Model.TotalPages; i++) { &lt;li&gt;&lt;a href="@Url.Action("Index", "Home", new { page = i})" class="@(i == Model.PageIndex ? "current-page" : "")"&gt;@(i + 1)&lt;/a&gt;&lt;/li&gt; } &lt;/ul&gt; &lt;/nav&gt; &lt;nav class="pagination-next-prev"&gt; &lt;ul&gt; @if (Model.HasPreviousPage) { &lt;li&gt;&lt;a href="@Url.Action("Index", "Home", new { page = (Model.PageIndex - 1) })" class="prev"&gt;&lt;/a&gt;&lt;/li&gt; } @if (Model.HasNextPage) { &lt;li&gt;&lt;a href="@Url.Action("Index", "Home", new { page = (Model.PageIndex + 1) })" class="next"&gt;&lt;/a&gt;&lt;/li&gt; } &lt;/ul&gt; &lt;/nav&gt; &lt;div&gt; Page @(Model.PageIndex + 1) of @Model.TotalPages &lt;/div&gt; &lt;/div&gt; </code></pre> <p>One problem with the view above, is that it creates numeric pages equal to the page sizes within model. If the model has 6 pages the result is</p> <p><a href="https://i.stack.imgur.com/MeNo1.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/MeNo1.png" alt="enter image description here"></a></p> <p>What will happen if i have 100 Model.Pages ?</p>