日韩无码专区无码一级三级片|91人人爱网站中日韩无码电影|厨房大战丰满熟妇|AV高清无码在线免费观看|另类AV日韩少妇熟女|中文日本大黄一级黄色片|色情在线视频免费|亚洲成人特黄a片|黄片wwwav色图欧美|欧亚乱色一区二区三区

RELATEED CONSULTING
相關(guān)咨詢(xún)
選擇下列產(chǎn)品馬上在線(xiàn)溝通
服務(wù)時(shí)間：8:30-17:00
你可能遇到了下面的問(wèn)題
關(guān)閉右側(cè)工具欄

新聞中心

這里有您想知道的互聯(lián)網(wǎng)營(yíng)銷(xiāo)解決方案
詳解ASP.NETMVC分頁(yè)的實(shí)現(xiàn)方法

ASP.NET MVC分頁(yè)已經(jīng)有很多文章講述過(guò)，這里我們將講述的ASP.NET MVC分頁(yè)的實(shí)現(xiàn)，需要靠自己設(shè)計(jì)，這就需要了解分頁(yè)的原理，以及相關(guān)數(shù)據(jù)庫(kù)的操作。編輯推薦《ASP.NET MVC框架視頻教程》

創(chuàng)新互聯(lián)公司主營(yíng)樂(lè)都網(wǎng)站建設(shè)的網(wǎng)絡(luò)公司,主營(yíng)網(wǎng)站建設(shè)方案,成都APP應(yīng)用開(kāi)發(fā),樂(lè)都h5重慶小程序開(kāi)發(fā)公司搭建,樂(lè)都網(wǎng)站營(yíng)銷(xiāo)推廣歡迎樂(lè)都等地區(qū)企業(yè)咨詢(xún)

在ASP.NET中，GridView控件本身就帶有分頁(yè)的功能，只要把當(dāng)前頁(yè)面的索引值賦給GridView的PageIndex就可以實(shí)現(xiàn)了分頁(yè)，至于數(shù)據(jù)怎么分頁(yè)，全都由GridView封裝起來(lái)了。

ASP.NET MVC分頁(yè)的實(shí)現(xiàn)就只能靠自己來(lái)設(shè)計(jì)了。首先來(lái)說(shuō)一下分頁(yè)的原理?，F(xiàn)在有一個(gè)張news表，中間有很多信息，我們假設(shè)一頁(yè)顯示5條記錄，這樣，頁(yè)面數(shù)量=總記錄數(shù)/5；這里，如果出現(xiàn)小數(shù)，得進(jìn)位取整。如比總記錄和數(shù)為51，那么分的頁(yè)面數(shù)量是11，最后一頁(yè)只有一條記錄。好，有這樣一個(gè)思路后，現(xiàn)在就來(lái)做ASP.NET MVC中的分頁(yè)了。

1、 數(shù)據(jù)庫(kù)和表

創(chuàng)建一個(gè)Data_Company的數(shù)據(jù)庫(kù)，建一張news表，表結(jié)構(gòu)如下圖：

ID是主鍵，并助是自動(dòng)增長(zhǎng)列。

2、 現(xiàn)在，我們用O/R Designer來(lái)創(chuàng)建news表的LINQ To SQL的實(shí)體類(lèi)。

創(chuàng)建一個(gè)名為MvcCompany的ASP.NET MVC Web Application項(xiàng)目，然后選中Models，右鍵，“添加”，“新建項(xiàng)”，選中C#中的“數(shù)據(jù)”，如下圖：

選擇“LINQ to SQL類(lèi)”，名稱(chēng)設(shè)為“CompanyData.dbml”，然后“添加”。

打開(kāi)“服務(wù)器資源管理器”，創(chuàng)建連接，展開(kāi)表，找到news表，拖到CompanyData.dbml的左邊表視圖區(qū)（注：.dbml視圖左邊是SQL表和SQL視圖區(qū)，右邊是SQL存儲(chǔ)過(guò)程和SQL函數(shù)區(qū)），效果如下圖：

在“解決方案資源管理器”下的，“Models”多了三個(gè)文件，CompanyData.dbml，展開(kāi)它，會(huì)有CompanyData.dbml.layout和CompanyData.designer.cs，前者是CompanyData.dbml視圖的一些信息（比如news表在的坐標(biāo)等信息），后者是news實(shí)體類(lèi)及Data_Company數(shù)據(jù)庫(kù)的類(lèi)，在數(shù)據(jù)庫(kù)類(lèi)中聚合了news實(shí)體類(lèi)。

3、 添加news列表類(lèi)。因?yàn)橐粋€(gè)news實(shí)體類(lèi)，一次只能表示一條記錄，如果呈現(xiàn)一個(gè)news表中的數(shù)據(jù)，最好定義一個(gè)集合類(lèi)來(lái)存臨時(shí)來(lái)存放news記錄的集合。

類(lèi)的實(shí)現(xiàn)如下：

 
 
 
 
    
  
  
  
  
  1. using System; 
    2. 
  
  
  
  
  2.  using System.Collections.Generic; 
    3. 
  
  
  
  
  3.  using System.Linq; 
    4. 
  
  
  
  
  4.  using System.Web; 
    5. 
  
  
  
  
  5.  namespace MvcCompany.Models 
    6. 
  
  
  
  
  6. { 
    7. 
  
  
  
  
  7. public class NewList : List
    8. 
  
  
  
  
  8. { 
    9. 
  
  
  
  
  9. /**//// 
    10. 
  
  
  
  
  10. /// 頁(yè)面索引值 
    11. 
  
  
  
  
  11. /// 
    12. 
  
  
  
  
  12. public int PageIndex { get; private set; } 
    13. 
  
  
  
  
  13. /**//// 
    14. 
  
  
  
  
  14. /// 每頁(yè)記錄的數(shù)量 
    15. 
  
  
  
  
  15. /// 
    16. 
  
  
  
  
  16. public int PageSize { get; private set; } 
    17. 
  
  
  
  
  17. /**//// 
    18. 
  
  
  
  
  18. /// 記錄總條數(shù) 
    19. 
  
  
  
  
  19. /// 
    20. 
  
  
  
  
  20. public int TotalCount { get; private set; } 
    21. 
  
  
  
  
  21. /**//// 
    22. 
  
  
  
  
  22. /// 共有的頁(yè)數(shù)和 
    23. 
  
  
  
  
  23. /// 
    24. 
  
  
  
  
  24. public int TotalPages { get; private set; } 
    25. 
  
  
  
  
  25. public NewList(IQueryable source, int pageIndex, int pageSize) 
    26. 
  
  
  
  
  26. { 
    27. 
  
  
  
  
  27. PageIndex = pageIndex; 
    28. 
  
  
  
  
  28. PageSize = pageSize; 
    29. 
  
  
  
  
  29. TotalCount = source.Count(); 
    30. 
  
  
  
  
  30. // 進(jìn)上去取整（ 總記錄條數(shù)/一面記錄的條數(shù)） 
    31. 
  
  
  
  
  31. TotalPages = (int)Math.Ceiling(TotalCount / (double)pageSize); 
    32. 
  
  
  
  
  32. this.AddRange(source.Skip(pageIndex * pageSize).Take(PageSize)); 
    33. 
  
  
  
  
  33. } 
    34. 
  
  
  
  
  34. /**//// 
    35. 
  
  
  
  
  35. /// 是否存在前續(xù)頁(yè) 
    36. 
  
  
  
  
  36. /// 
    37. 
  
  
  
  
  37. public bool HasPreviousPage 
    38. 
  
  
  
  
  38. { 
    39. 
  
  
  
  
  39. get { return (PageIndex > 0); } 
    40. 
  
  
  
  
  40. } 
    41. 
  
  
  
  
  41. /**//// 
    42. 
  
  
  
  
  42. /// 是否存在后續(xù)頁(yè) 
    43. 
  
  
  
  
  43. /// 
    44. 
  
  
  
  
  44. public bool HasNextPage 
    45. 
  
  
  
  
  45. { 
    46. 
  
  
  
  
  46. get { return (PageIndex + 1 < AllPages); } 
    47. 
  
  
  
  
  47. } 
    48. 
  
  
  
  
  48. }}
    49.

這里，我們實(shí)現(xiàn)了一個(gè)泛型的集合列表NewList（當(dāng)然，這里的本質(zhì)上可以當(dāng)其他實(shí)體類(lèi)的集合列表），在這個(gè)類(lèi)中間，有四個(gè)字段，訪(fǎng)問(wèn)修飾符都是public的，分另為：

PageIndex：當(dāng)前頁(yè)面的索引值

PageSize：每個(gè)頁(yè)面的記錄的條數(shù)

AllCount：記錄的總條數(shù)

AllPages：共有的頁(yè)面總數(shù)

在NewList 構(gòu)造函數(shù)中，有如下代碼：

    
   
   
   
    
     
    
    
    
  1. public NewList(IQueryable list, int pageIndex, int pageSize) 
    2. 
     
    
    
    
  2. { 
    3. 
     
    
    
    
  3. PageIndex = pageIndex;  
    4. 
     
    
    
    
  4.  PageSize = pageSize; 
    5. 
     
    
    
    
  5. AllCount = source.Count();  
    6. 
     
    
    
    
  6. AllPages = (int)Math.Ceiling(AllCount / (double)pageSize); 
    7. 
     
    
    
    
  7. this.AddRange(list.Skip(PageIndex * PageSize).Take(PageSize)); 
    8. 
     
    
    
    
  8. }
    9.

構(gòu)造函的參數(shù)有三個(gè)，一個(gè)是list，就是實(shí)體類(lèi)的一個(gè)集合，還有就是頁(yè)面索引值和每個(gè)頁(yè)面的記錄條數(shù)。

第1、2代碼很容易理角，第3行代碼是得到列表的總記錄條數(shù)，第4行代碼，就完成了我們?cè)陂_(kāi)始時(shí)分析的分頁(yè)實(shí)現(xiàn)的公式：頁(yè)面數(shù)量=總記錄數(shù)/每頁(yè)記錄數(shù)，其中Math.Ceiling就是把小數(shù)部分進(jìn)到整數(shù)的函數(shù)。

最關(guān)鍵的是第5行代碼，首先看Skip(PageIndex*PageSize)，頁(yè)面索引值乘上每頁(yè)記錄數(shù)，得到是當(dāng)前頁(yè)面以前的所有記錄數(shù)，Skip是跳過(guò)這些記錄，而得到后面的所有記錄，Take(PageSize)是得到PageSize條數(shù)的記錄，比如，我們想要第三頁(yè)的記錄，這個(gè)頁(yè)面的索引值為2（因?yàn)樗饕祻?開(kāi)始）PageIndex=2，每頁(yè)顯示5條記錄，PageSize=5，就是要跳過(guò)list中的前10條記錄，然后再取前5條記錄，即取list中的第11條到第15條記錄，也就是第3頁(yè)的記錄了。

在這里，微軟提供了Skip和Tabke函數(shù)，讓我們做起分頁(yè)來(lái)，得心應(yīng)手。

接下來(lái)是this.AddRange()函數(shù)，可以把批量的數(shù)據(jù)放到當(dāng)前集合中（因?yàn)镹ewList本身就是一個(gè)集合）。

代碼的后半部分是兩個(gè)屬性：

 
 
 
 
    
  
  
  
  
  1. public bool HasPreviousPage 
    2. 
  
  
  
  
  2. { 
    3. 
  
  
  
  
  3. get { return (PageIndex > 0); } 
    4. 
  
  
  
  
  4. } 
    5. 
  
  
  
  
  5. public bool HasNextPage 
    6. 
  
  
  
  
  6. { 
    7. 
  
  
  
  
  7. get { return (PageIndex + 1 < AllPages); } 
    8. 
  
  
  
  
  8. }
    9.

這兩個(gè)屬性是為頁(yè)面顯示“上一頁(yè)”和“下一頁(yè)”，因?yàn)楫?dāng)我們顯示第一頁(yè)的時(shí)候，“上一頁(yè)”是不需要顯示的，如果最后一頁(yè)，是沒(méi)有“下一頁(yè)“的，所以在這里定義了兩個(gè)屬性，來(lái)判斷是否有上一頁(yè)和下一頁(yè)。

先看HasPreviousPage屬性，如果PageIndex是大于0的，說(shuō)明不是在第一頁(yè)，所以就反回true，如果小于等于0（在這里小于0是沒(méi)有意思義的，因?yàn)轫?yè)面的索引值最小是0），說(shuō)明是第一頁(yè)，所以返回是false。

再看HasNextPage屬性，因?yàn)轫?yè)面索引值的最大數(shù)，與頁(yè)面的最大數(shù)差1(索引從0開(kāi)始的原因)，所以當(dāng)PageIndex+1小于AllPages時(shí)，說(shuō)沒(méi)有沒(méi)到最后一頁(yè)，返回值是true，如果PageIndex+1大于等于AllPages時(shí)（大于也沒(méi)有意義），說(shuō)明是最后一頁(yè)，返回值為false。

4、 添加NewsController。選中Controller，右鍵添加一個(gè)NewsController 的Controller。

代碼如下：

 
 
 
 
    
  
  
  
  
  1. using System; 
    2. 
  
  
  
  
  2.  using System.Collections.Generic; 
    3. 
  
  
  
  
  3.  using System.Linq; 
    4. 
  
  
  
  
  4.  using System.Web; 
    5. 
  
  
  
  
  5. using System.Web.Mvc; 
    6. 
  
  
  
  
  6. using System.Web.Mvc.Ajax; 
    7. 
  
  
  
  
  7. using MvcCompany.Models; 
    8. 
  
  
  
  
  8. using System.Configuration; 
    9. 
  
  
  
  
  9. namespace MvcCompany.Controllers 
    10. 
  
  
  
  
  10. { 
    11. 
  
  
  
  
  11. public class NewsController : Controller 
    12. 
  
  
  
  
  12. { 
    13. 
  
  
  
  
  13. DataClassesDataContext DCDC; 
    14. 
  
  
  
  
  14. int pageSize; 
    15. 
  
  
  
  
  15. public NewsController() 
    16. 
  
  
  
  
  16. { 
    17. 
  
  
  
  
  17. DCDC = new DataClassesDataContext(); 
    18. 
  
  
  
  
  18. pageSize = Convert.ToInt32(ConfigurationManager.AppSettings["pagesize"]); //每個(gè)頁(yè)面的數(shù)量存放在web.config的appsetting里的pagesize節(jié)中，值為5 
    19. 
  
  
  
  
  19. } 
    20. 
  
  
  
  
  20. public ActionResult Index(int? page) 
    21. 
  
  
  
  
  21. { 
    22. 
  
  
  
  
  22. var NewsList = DCDC.news.Select(newss=>newss); 
    23. 
  
  
  
  
  23. var paginatedNews = new NewList(NewsList, page ?? 0, pageSize); //實(shí)現(xiàn)分頁(yè)功能 
    24. 
  
  
  
  
  24. return View(paginatedNews); 
    25. 
  
  
  
  
  25. } 
    26. 
  
  
  
  
  26. [AcceptVerbs(HttpVerbs.Post)] 
    27. 
  
  
  
  
  27. public ActionResult Index(FormCollection formValues) 
    28. 
  
  
  
  
  28. { 
    29. 
  
  
  
  
  29. int? index = int.Parse(formValues.GetValue("pageindex").AttemptedValue); 
    30. 
  
  
  
  
  30. int page = index ??0 ; 
    31. 
  
  
  
  
  31. var NewsList = DCDC.news.Select(newss => newss); 
    32. 
  
  
  
  
  32. var paginatedNews = new NewList(NewsList, page, pageSize); //實(shí)現(xiàn)分頁(yè)功能 
    33. 
  
  
  
  
  33. return View(paginatedNews); 
    34. 
  
  
  
  
  34. } 
    35. 
  
  
  
  
  35. } 
    36. 
  
  
  
  
  36. } 
    37.

關(guān)于兩個(gè)Index重載，我們?cè)谠O(shè)計(jì)完Views再討論。

5、 添加View。選中NewsController，右鍵，添加View，會(huì)彈出如下圖：

在這里，我們選中MvcCompany.Models.news，在View content下拉列表中選擇List（因?yàn)橐獙?shí)現(xiàn)列表分頁(yè)）。

Index.aspx頁(yè)面代碼如下：

 
 
 
 
    
  
  
  
  
  1. <%@ Page Title="" Language="C#" MasterPageFile="~/Views/Shared/Site.Master" Inherits="System.Web.Mvc.ViewPage>" %>
    2. 
  
  
  
  
  2.  ID="Content1" ContentPlaceHolderID="TitleContent" runat="server">
    3. 
  
  
  
  
  3. 新聞 
    4. 
  
  
  
  
    5. 
  
  
  
  
  5.  ID="Content2" ContentPlaceHolderID="MainContent" runat="server">
    6. 
  
  
  
  
    7. 
  
  
  
  
  7. <%using (Html.BeginForm()) 
    8. 
  
  
  
  
  8. { %>
    9. 
  
  
  
  
    10. 
  
  
  
  
  10. 新聞列表
    11. 
  
  
  
  
  18. <% foreach (var item in Model) 
  19. { %>
  26. <% } %>
    28. 
  
  
  
  
    
  
  
  
  
  
  
  
  
  28. 編號(hào) 
    29. 
  
  
  
  
    		30. 
  
  
  
  
  
  
  
  
  30. 題目 
    31. 
  
  
  
  
    		32. 
  
  
  
  
  
  
  
  
  32. 時(shí)間 
    33. 
  
  
  
  
    		34. 
  
  
  
  
  
  
  
  
  34. 內(nèi)容 
    35. 
  
  
  
  
    		36. 
  
  
  
  
    
  
  
  
  
  
  
  
  
  
  
  
  
    
  
  
  
  
  
  
  
  
  36. <%= Html.Encode(item.ID)%>
    37. 
  
  
  
  
    		38. 
  
  
  
  
  
  
  
  
  38. <%= Html.Encode(item.title)%>
    39. 
  
  
  
  
    		40. 
  
  
  
  
  
  
  
  
  40. <%= Html.Encode(String.Format("{0:g}", item.datetimes))%>
    41. 
  
  
  
  
    		42. 
  
  
  
  
  
  
  
  
  42. <%= Html.Encode(item.contents)%>
    43. 
  
  
  
  
    		44. 
  
  
  
  
    
  
  
  
  
  
  
  
  
    44. 
  
  
  
  
  44.  />
    45. 
  
  
  
  
    46. 
  
  
  
  
  46. <% =Html.RouteLink("首頁(yè)", "UpcomingNews", new { page = 0 })%>| 
    47. 
  
  
  
  
  47. <% if (Model.HasPreviousPage) 
    48. 
  
  
  
  
  48. {%>
    49. 
  
  
  
  
  49. <% =Html.RouteLink("上一頁(yè)", "UpcomingNews", new { page = (Model.PageIndex - 1) })%>| 
    50. 
  
  
  
  
  50. <%} %>
    51. 
  
  
  
  
  51. <% if (Model.HasNextPage) 
    52. 
  
  
  
  
  52. {%>
    53. 
  
  
  
  
  53. <% =Html.RouteLink("下一頁(yè)", "UpcomingNews", new { page = (Model.PageIndex + 1) })%>| 
    54. 
  
  
  
  
  54. <%} %>
    55. 
  
  
  
  
  55. <% =Html.RouteLink("尾頁(yè)", "UpcomingNews", new { page = Model.PageSize - 1 })%>          
    56. 
  
  
  
  
  56. 第 
    57. 
  
  
  
  
  57. <%=Html.TextBox("pageindex", Model.PageIndex, new {style="width:30px;"})%>頁(yè)
    58. 
  
  
  
  
  58. type="submit" value="轉(zhuǎn)到" id="sub" />
    59. 
  
  
  
  
  59. <%} %>
    60. 
  
  
  
  
    61.

代碼的前半部分，很好理解。

代碼的后半部分，我們來(lái)分析一下，首頁(yè)，是采用

Html.RouteLink(“首頁(yè)”,”UpcomingNews”,new{ page=0})，是要定位到名稱(chēng)為”UpcomingNews”的路由，這個(gè)路由在Global.asax中，代碼如下：

 
 
 
 
    
  
  
  
  
  1. routes.MapRoute( 
    2. 
  
  
  
  
  2. "UpcomingNews", 
    3. 
  
  
  
  
  3. "News/page/{page}", 
    4. 
  
  
  
  
  4. new { controller = "News", action = "Index" });
    5.

路由的名稱(chēng)是”UpcominNews”，Url格式是News/page/{page}，News和page是url的一種格式，后面{page}是參數(shù)，這個(gè)參數(shù)的名稱(chēng)要與View中，后半部分的new{page=0}的page，以及NewsController中的方法Index(int? page)中的page都必需統(tǒng)一。如果有請(qǐng)求

News/page/2的url，實(shí)際上請(qǐng)求的是 news?page=2的頁(yè)網(wǎng)（路由在ASP.NET MVC官上有說(shuō)明）。

首頁(yè)為中的page=0，最終會(huì)成為NesController中Index(int? page)方法，的實(shí)參，返回首頁(yè)數(shù)據(jù)（及數(shù)據(jù)庫(kù)表的前5條數(shù)據(jù)）。

上一頁(yè)，在當(dāng)前頁(yè)數(shù)PageIndex的基礎(chǔ)上減1。

下一頁(yè)，在當(dāng)前頁(yè)數(shù)PageIndex的基礎(chǔ)上加1

（注：上面的加減1都不會(huì)越界，因?yàn)楫?dāng)顯示第一頁(yè)時(shí)，“上一頁(yè)”的超連接就不會(huì)顯示。當(dāng)最后一頁(yè)時(shí)，“下一頁(yè)”的超連接就不會(huì)顯示）

尾頁(yè)同首頁(yè)。

現(xiàn)在的一個(gè)問(wèn)題是“轉(zhuǎn)到”第幾頁(yè)的實(shí)現(xiàn)，我們知道，轉(zhuǎn)到第幾頁(yè)的“幾”，得用戶(hù)輸入，所以這里用一個(gè)Html.TextBox來(lái)實(shí)現(xiàn)，完全代碼是

 
 
 
 
    
  
  
  
  
  1. <%=Html.TextBox("pageindex", Model.PageIndex, new {style="width:30px;"})%>
    2.

最終會(huì)生成一個(gè)名稱(chēng)為pageindex的intup，類(lèi)型為T(mén)ext，它的值始終為當(dāng)前的索引頁(yè)值Model.PageIndex，其中有一個(gè)寬度的屬性new {style="width:30px;"}。

同時(shí)還有一個(gè)用來(lái)向后參提交。因?yàn)榇a中有

表單，所以可以在NewsController中接收這個(gè)提交。

Index(FormCollection formValues)方法用來(lái)處理這個(gè)提交。這里會(huì)從formValues.GetValue("pageindex").AttemptedValue中午到客戶(hù)端用戶(hù)輸入“pageindex”文本框中的值。從而來(lái)完成定向。

至此，我們就用ASP.NET MVC實(shí)現(xiàn)了一個(gè)分頁(yè)功能，相比之下要難ASP.NET的GridView自動(dòng)分頁(yè)好多。

在這個(gè)例子中，我們?cè)贛odels層中提供了實(shí)體類(lèi)及news表的集合類(lèi)。在Controller層增加了NewsController類(lèi)。在View層增加了News的view，從M-V-C角度，分別完成了對(duì)分頁(yè)的功能。


文章名稱(chēng)：詳解ASP.NETMVC分頁(yè)的實(shí)現(xiàn)方法
網(wǎng)站網(wǎng)址：http://www.5511xx.com/article/djoesed.html