欧美bbbwbbbw肥妇,免费乱码人妻系列日韩,一级黄片

MVC異步分頁代碼分享

 更新時(shí)間:2016年09月18日 11:56:16   作者:小鋒神  
這篇文章主要為大家詳細(xì)介紹了MVC異步分頁代碼,具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下

如圖:

 

1、控制器代碼 

//

    // GET: /AjaxUser/

    shopEntities shop = new shopEntities();
    public ActionResult Index()
    {
      return View();
    }
    public ActionResult loadjson()

    {
      int pageSize = Request["pageSize"] == null ? 10 : int.Parse(Request["pageSize"]);
      int pageIndex = Request["pageIndex"] == null ? 1 : int.Parse(Request["pageIndex"]);
      int totalCount = shop.tbl_admin.Count();
 

      //給前臺(tái)userinfo所有的數(shù)據(jù),并且是json格式
      var allorder = shop.tbl_admin.OrderBy(u=>u.id)
        .Skip(pageSize*(pageIndex-1))
        .Take(pageSize)
        .ToList();
      //接受一個(gè)對(duì)像,內(nèi)部把此對(duì)象使用javaScript序列化類對(duì)象志字符串,發(fā)送到前臺(tái)
      var data = from u in allorder select new { u.id,u.realname,u.sex};
      string strNav = PageNavHelper.ShowPageNavigate(pageIndex,pageSize,totalCount);
      var result = new {Data=data, NavStr=strNav };
      return Json(result, JsonRequestBehavior.AllowGet);

    }

2、Html代碼 

@{
  Layout = null;
}
<!DOCTYPE html>
<html>

<head>

  <meta name="viewport" content="width=device-width" />

  <title>Index</title>
  <link href="~/Content/NavPage.css" rel="stylesheet" />
  <script src="~/Scripts/jquery-1.8.2.min.js"></script>
  <script src="~/Scripts/jquery-ui-1.8.24.js"></script>
  <script src="~/Scripts/jquery.easyui.min.js"></script>
  <script src="~/Scripts/jquery.unobtrusive-ajax.js"></script>
  <script src="~/Scripts/jquery.validate.unobtrusive.js"></script>
  <script type="text/javascript">
    $(function () {
      //頁面加載完成后從后如加載當(dāng)前頁數(shù)據(jù)
      initTable();
    });

  //初始化表格數(shù)據(jù)

    function initTable(queryData) 

    {

      $.getJSON("/AjaxUser/loadjson",queryData, function (data) {
        var tb = $("#tbList");
        //先移除舊的,添加新的
        $("#tbList tr[type=data]").remove();
        for (var i = 0; i < data.Data.length; i++)
        { 

          var strTr = "<tr type='data'>";
          strTr += "<td>" + data.Data[i].id + "</td>";
          strTr += "<td>" + data.Data[i].realname + "</td>";
          strTr += "<td>" + data.Data[i].sex + "</td>";
          strTr += "<td><a UId='" + data.Data[i].id + "' href='javascript:void(0)'>修改</a>" +
            "<a UId='" + data.Data[i].ID + "' href='javascript:void(0)'>刪除</a></td>";
          strTr += "</tr>";
          tb.append(strTr);

        }

        $("#Nav").html(data.NavStr);

        //綁定分頁標(biāo)簽的點(diǎn)擊事件

        $(".pageLink").click(function () {
          //把頁碼彈出來
          var strHref = $(this).attr("href");
          var queryStr = strHref.substr(strHref.indexOf('?') + 1);
          //alert(queryStr);
          initTable(queryStr);
          return false;
        });
      });
    }
  </script>

</head>
<body>
  <div>
    <table id="tbList">
      <tr>
        <td>id</td>

        <td>姓名</td>
        <td>性別</td>
        <td>操作</td>

      </tr>
    </table>
    <div id="Nav" class="paginator"> 
    </div>     
  </div>

</body>

</html> 

3、分頁類

using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using System.Web;
namespace MvcTest4.Models

{
  public class PageNavHelper

  {
    //主要就是輸出分頁的超級(jí)鏈接的標(biāo)簽

    //自定義分頁Helper擴(kuò)展

    public static string ShowPageNavigate(int currentPage, int pageSize, int totalCount)
    {

      var redirectTo = HttpContext.Current.Request.Url.AbsolutePath;
      pageSize = pageSize <= 0 ? 3 : pageSize;
      var totalPages = Math.Max((totalCount + pageSize - 1) / pageSize, 1); //總頁數(shù)
       var output = new StringBuilder();
      if (totalPages > 1)

      {

        //if (currentPage != 1)

        {//處理首頁連接

          output.AppendFormat("<a class='pageLink' href='{0}?pageIndex=1&pageSize={1}'>首頁</a> ", redirectTo, pageSize);
        }
        if (currentPage > 1)
        {//處理上一頁的連接
          output.AppendFormat("<a class='pageLink' href='{0}?pageIndex={1}&pageSize={2}'>上一頁</a> ", redirectTo, currentPage - 1, pageSize);
        }

        else
        {
          // output.Append("<span class='pageLink'>上一頁</span>");

        }
        output.Append(" ");
        int currint = 5;
        for (int i = 0; i <= 10; i++)
        {//一共最多顯示10個(gè)頁碼,前面5個(gè),后面5個(gè)
          if ((currentPage + i - currint) >= 1 && (currentPage + i - currint) <= totalPages)
          {

            if (currint == i)

            {//當(dāng)前頁處理

              //output.Append(string.Format("[{0}]", currentPage));

              output.AppendFormat("<a class='cpb' href='{0}?pageIndex={1}&pageSize={2}'>{3}</a> ", redirectTo, currentPage, pageSize, currentPage);
            }
            else
            {//一般頁處理
              output.AppendFormat("<a class='pageLink' href='{0}?pageIndex={1}&pageSize={2}'>{3}</a> ", redirectTo, currentPage + i - currint, pageSize, currentPage + i - currint);

            }
          }
          output.Append(" ");

        }

        if (currentPage < totalPages)
        {//處理下一頁的鏈接
          output.AppendFormat("<a class='pageLink' href='{0}?pageIndex={1}&pageSize={2}'>下一頁</a> ", redirectTo, currentPage + 1, pageSize);
        }
        else
        {
          //output.Append("<span class='pageLink'>下一頁</span>");
        }
        output.Append(" ");
        if (currentPage != totalPages)
        {
          output.AppendFormat("<a class='pageLink' href='{0}?pageIndex={1}&pageSize={2}'>末頁</a> ", redirectTo, totalPages, pageSize);
        }
        output.Append(" ");
      }
      output.AppendFormat("第{0}頁 / 共{1}頁", currentPage, totalPages);//這個(gè)統(tǒng)計(jì)加不加都行
 
      return output.ToString();

    }

  }

} 

4、分頁CSS 

body {
} 
.paginator {
  font: 12px Arial, Helvetica, sans-serif;
  padding: 10px 20px 10px 0;
  margin: 0px;
}

  .paginator a {
    border: solid 1px #ccc;
    color: #0063dc;
    cursor: pointer;
    text-decoration: none;
  }
    .paginator a:visited {
      padding: 1px 6px;
      border: solid 1px #ddd;
      background: #fff;
      text-decoration: none;
    }
  .paginator .cpb {
    border: 1px solid #F50;
    font-weight: 700;
    color: #F50;
    background-color: #ffeee5;
  }

  .paginator a:hover {
    border: solid 1px #F50;
    color: #f60;
    text-decoration: none;
  }
  .paginator a, .paginator a:visited, .paginator .cpb, .paginator a:hover {
    float: left;
    height: 16px;
    line-height: 16px;
    min-width: 10px;
    _width: 10px;
    margin-right: 5px;
    text-align: center;
    white-space: nowrap;
    font-size: 12px;
    font-family: Arial,SimSun;
    padding: 0 3px;

  } 

以上就是本文的全部?jī)?nèi)容,希望對(duì)大家的學(xué)習(xí)有所幫助,也希望大家多多支持腳本之家。

相關(guān)文章

  • log4net教程日志分類和自動(dòng)維護(hù)示例

    log4net教程日志分類和自動(dòng)維護(hù)示例

    log4net能不能按照功能分類呢?如果通過配置不同的logger,然后功能根據(jù)不同的LoggerName加載Ilog實(shí)例,是可以做到。但由于這些功能的log配置差異性極小,也許僅僅就是文件名不同。于是想通過代碼進(jìn)行配置,下面把方法分享如下
    2014-01-01
  • Net Core Web Api項(xiàng)目與在NginX下發(fā)布的方法

    Net Core Web Api項(xiàng)目與在NginX下發(fā)布的方法

    這篇文章主要介紹了Net Core Web Api項(xiàng)目與在NginX下發(fā)布的方法,文中通過示例代碼介紹的非常詳細(xì),對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧
    2020-03-03
  • ASP.NET中高質(zhì)量縮略圖的生成代碼

    ASP.NET中高質(zhì)量縮略圖的生成代碼

    ASP.NET中高質(zhì)量縮略圖的生成代碼...
    2007-09-09
  • ASP.NET中JSON的序列化和反序列化使用說明

    ASP.NET中JSON的序列化和反序列化使用說明

    JSON是專門為瀏覽器中的網(wǎng)頁上運(yùn)行的JavaScript代碼而設(shè)計(jì)的一種數(shù)據(jù)格式。
    2011-07-07
  • .Net中的弱引用字典WeakDictionary和ConditionalWeakTable介紹

    .Net中的弱引用字典WeakDictionary和ConditionalWeakTable介紹

    這篇文章介紹了.Net中的弱引用字典WeakDictionary和ConditionalWeakTable,文中通過示例代碼介紹的非常詳細(xì)。對(duì)大家的學(xué)習(xí)或工作具有一定的參考借鑒價(jià)值,需要的朋友可以參考下
    2022-06-06
  • C# web api返回類型設(shè)置為json的兩種方法

    C# web api返回類型設(shè)置為json的兩種方法

    web api寫api接口時(shí)默認(rèn)返回的是把你的對(duì)象序列化后以XML形式返回,那么怎樣才能讓其返回為json呢,下面為大家介紹幾種不錯(cuò)的方法
    2014-02-02
  • 一步步教你讀懂NET中IL(圖文詳解)

    一步步教你讀懂NET中IL(圖文詳解)

    本文章以一個(gè)實(shí)際的例子,讓你了解堆疊式 VM 的運(yùn)作原理,并對(duì) .NET IL(Intermediate Language)有最基本的領(lǐng)略,需要的朋友可以參考下
    2013-07-07
  • asp.net截屏功能實(shí)現(xiàn)截取web頁面

    asp.net截屏功能實(shí)現(xiàn)截取web頁面

    這篇文章主要介紹了asp.net截屏功能實(shí)現(xiàn)截取web頁面,是非常實(shí)用的一個(gè)功能,需要的朋友可以參考下
    2014-08-08
  • .NET Core下使用Kafka的方法步驟

    .NET Core下使用Kafka的方法步驟

    這篇文章主要介紹了.NET Core下使用Kafka的方法步驟,文中通過示例代碼介紹的非常詳細(xì),對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧
    2020-09-09
  • ASP.NET中Ajax怎么使用

    ASP.NET中Ajax怎么使用

    這篇文章主要介紹了ASP.NET中Ajax使用方法的相關(guān)資料,非常不錯(cuò),具有參考借鑒價(jià)值,需要的朋友可以參考下
    2016-07-07

最新評(píng)論