ASP.NET利用存儲過程實現(xiàn)分頁
作者：admin
先寫一個存儲過程，然后就是通過div+css來布局點頁碼傳到該頁面的參數(shù)的值了，思路是通過用StringBuilder類后臺布局div以實現(xiàn)動態(tài)的頁碼，然后通過頁碼調(diào)用存儲過程，得到相應(yīng)的信息。
首先說下思路，寫一個存儲過程，我也找了一個存儲過程，不過不是我寫的，出處：http://www.cnblogs.com/zhongweiv/archive/2011/10/31/JqueryPagination.html 這是一個通過jqurey+ajax實現(xiàn)無刷新分頁的例子，應(yīng)該也不錯，因為有的時候要無刷新嘛，我用的存儲過程就是從那里copy來的，但是我看了58.com還有一些其他的一些網(wǎng)站信息分頁都不會通過無刷新的，所以我特地的寫了一個有刷新的分頁的方法，好了，先寫一個存儲過程，然后就是通過div+css來布局點頁碼傳到該頁面的參數(shù)的值了，思路是通過用StringBuilder類后臺布局div以實現(xiàn)動態(tài)的頁碼，然后通過頁碼調(diào)用存儲過程，得到相應(yīng)的信息，***就是一些細(xì)節(jié)了，不斷的運行調(diào)試找出BUG并改正。
一、首先看下頁面前臺代碼
- <%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Page.aspx.cs" Inherits="Jquery.Page"%>
- <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
- <html xmlns="http://www.w3.org/1999/xhtml">
- <head runat="server">
- <title>Tandy Tang有刷新分頁...</title>
- <style type="text/css">
- /*分頁部分 start*/
- ul
- {
- margin:0px;
- padding:0px;
- }
- .page
- {
- width:700px;
- background-color:#ffffff;
- height:50px;
- margin-top:15px;
- }
- .page ul li
- {
- float:left;
- display:block;
- width:28px;
- height:23px;
- text-align:center;
- margin-left:1px;
- vertical-align:middle;
- border-style:solid;
- border-width:1px;
- border-color:#b1add0;
- }
- .page ul li span
- {
- display:block;
- width:28px;
- height:23px;
- background-color:#2d8da3;
- }
- .page ul li span a
- {
- color:#ffffff;
- }
- .page ul li a
- {
- display:block;
- width:28px;
- height:19px;
- text-decoration:none;
- color:#354c7e;
- font-size:12px;
- vertical-align:middle;
- padding-top:4px;
- }
- .page ul li a:hover
- {
- background-color:#2d8da3;
- display:block;
- width:28px;
- height:19px;
- }
- .page .point
- {
- background-color:#ffffff;
- width:20px;
- height:24px;
- display:block;
- border-style:solid;
- border-width:0px;
- border-color:#ffffff;
- }
- .page .pre
- {
- width:48px;
- height:22px;
- display:block;
- text-align:center;
- border-style:solid;
- border-width:1px;
- border-color:#b1add0;
- }
- .page .pre a:hover
- {
- background-color:#2d8da3;
- display:block;
- width:48px;
- height:19px;
- }
- .page .next
- {
- width:48px;
- height:22px;
- display:block;
- text-align:center;
- border-style:solid;
- border-width:1px;
- border-color:#b1add0;
- }
- .page .next a:hover
- {
- background-color:#2d8da3;
- display:block;
- width:48px;
- height:19px;
- }
- /*分頁部分 end*/
- /*內(nèi)容部分 start*/
- .content
- {
- width:700px;
- height:120px;
- border-style:solid;
- border-width:1px;
- border-color:#333333;
- margin-bottom:10px;
- }
- .content_left
- {
- width:98px;
- height:118px;
- border-style:solid;
- border-width:1px;
- border-color:#333333;
- float:left;
- font-size:12px;
- }
- .content_right
- {
- margin-left:10px;
- width:588px;
- height:118px;
- border-style:solid;
- border-width:1px;
- border-color:#0000ff;
- float:left;
- }
- /*內(nèi)容部分 end*/
- </style>
- </head>
- <body>
- <form id="form1" runat="server">
- <div>
- <asp:Label ID="lbl1" runat="server"></asp:Label><!--放內(nèi)容-->
- <asp:Label ID="lbl2" runat="server"></asp:Label><!--放頁碼-->
- </div>
- </form>
- </body>
- </html>
css沒有用.css文件寫是為了方便，呵呵……
存儲過程應(yīng)該寫得很詳細(xì)了...我就不解釋了。這個存儲過程的用處很多啊，如果想實現(xiàn)無刷新的分頁的話也是可以用的，調(diào)用的方法基本一樣，大家可以自己試試。
好吧，到這里代碼也基本上完成了，我認(rèn)為主要的還是思路問題，思路有了就好辦了，代碼如果哪里有誤或者有哪些更好的解決方案，請告訴我啊，一定虛心學(xué)習(xí)哈。下面看下效果圖吧！效果圖如下：
【編輯推薦】
責(zé)任編輯：張偉
來源：
ASP.NET學(xué)習(xí)網(wǎng)
