Custom paging in ASP.NET MVC 5 depend on Bootstrap

https://stackoverflow.com/questions/41327645/how-to-make-a-custom-paging-in-asp-net-mvc-5-depend-on-bootstrap

This is my code and its working properly
Note: this paging code need bootstrap to be exist
Add new file in the models named Paging.cs

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.Mvc;
using System.Web.Mvc.Ajax;
using System.Web.Security;

namespace project.Models
{
 public class Paging
 {
 private projectEntities db = new projectEntities();

 public string Pagination(int total, int page, int Take, int offset, string Controler, string View, string Params)
 {
 if (total > 0)
 {
 string c_url = HttpContext.Current.Request.Url.AbsoluteUri.ToLower();
 string URL = c_url.Substring(0, c_url.IndexOf(Controler.ToLower()));
 double rowPerPage = Take;
 if (Convert.ToDouble(total) < Take)
 {
 rowPerPage = Convert.ToDouble(total);
 }

 int totalPage = Convert.ToInt16(Math.Ceiling(Convert.ToDouble(total) / rowPerPage));
 int current = page;
 int record = offset;
 int pageStart = Convert.ToInt16(Convert.ToDouble(current) - Convert.ToDouble(offset));
 int pageEnd = Convert.ToInt16(Convert.ToDouble(current) + Convert.ToDouble(offset));
 string numPage = "";
 if (totalPage < 1) return "";
 numPage += "<ul class='pagination'>";
 if (current > 1) numPage += "<li class='previous'><a href='" + URL + Controler + View + "?Page=" + (page - 1) + Params + "' aria-label='Previous'>&laquo;</a></li>";
 else numPage += "<li class='disabled'><a href='#' aria-label='Previous'><span aria-hidden='true'>&laquo;</span></a></li>";
 if (current > (offset + 1)) numPage += "<li><a href='" + URL + Controler + View + "?Page=1" + Params + "' name='page1'>1</a></li><li class='disabled spacing-dot'><a href='#'>...</a></li>";
 for (int i = 1; i <= totalPage; i++)
 {
 if (pageStart <= i && pageEnd >= i)
 {
 if (i == current) numPage += "<li class='active'><a href='#'>" + i + " <span class='sr-only'>(current)</span></a></li>";
 else numPage += "<li><a href='" + URL + Controler + View + "?Page=" + i + Params + "'>" + i + "</a></li>";
 }
 }
 if (totalPage > pageEnd)
 {
 record = offset;
 numPage += "<li class='disabled spacing-dot'><a href='#'>...</a></li><li><a href='" + URL + Controler + View + "?Page=" + (totalPage) + Params + "'>" + totalPage + "</a></li>";
 }
 if (current < totalPage) numPage += "<li class='next'><a class='ui-bar-d' href='" + URL + Controler + View + "?Page=" + (page + 1) + Params + "'>&raquo;</a></li>";
 else numPage += "<li class='disabled'><a href='#' aria-label='Previous'><span aria-hidden='true'>&raquo;</span></a></li>";
 numPage += "</ul>";
 return numPage;
 }
 else
 {
 return "no records found";
 }
 }
 }
}

You can used in your controller like the below:

    Paging pg = new Paging();
    private projectEntities db = new projectEntities();

    //ex : Controller name-> news, view_name -> browse
    public ActionResult Index()
    {
        int offset = 1;
        int Page = 1;
        int Take = 20;
        if (Convert.ToInt32(Request.QueryString["Page"]) > 1)
        {
            Page = Convert.ToInt32(Request.QueryString["Page"]);
        }

        int skip = 0;
        if (Page == 1)
            skip = 0;
        else
            skip = ((Page - 1) * Take);
        int total = db.Table_Name.Count();
        var data = db.Table_Name.Skip(skip).Take(Take);
        string paging = pg.Pagination(total, Page, Take, offset, "news", "/browse", "");
        ViewBag.Paging = paging;
        return View(data.ToList());
    }

After that you can call it in the view like this:

@model IEnumerable<project.Models.project>
@{
 ViewBag.Title = "News";
 Layout = "~/Views/Shared/_Layout.cshtml";
}
<div class="container">
 <table class="table table-striped">
 <tr>
 <th>
 @Html.DisplayNameFor(model => model.field_name)
 </th>
 </tr>
 @foreach (var item in Model)
 {
 <tr>
 <td>
 @Html.DisplayFor(modelItem => item.field_name)
 </td>
 </tr>
 }
 </table>
@Html.Raw(ViewBag.Paging)

JavaScript

https://toidicodedao.com/2016/01/19/series-javascript-sida-object-trong-javascript/

https://toidicodedao.com/2016/01/26/series-javascript-sida-luan-ban-ve-cai-dit-this-trong-javascript/

https://toidicodedao.com/2016/08/16/js-truyen-ki-chuong-1-luoc-su-giang-ho/

https://toidicodedao.com/2016/08/18/js-truyen-ki-chuong-2-vo-lam-day-song/

https://toidicodedao.com/2016/08/23/js-truyen-ki-chuong-3-quan-hung-cat-cu/

https://toidicodedao.com/2017/10/10/async-await-trong-javascript/

/* index.html */

/* site.js */