功能簡(jiǎn)介：主要功能就是分頁(yè)顯示數(shù)據(jù)了，可在配置文件中配置每頁(yè)要顯示的頁(yè)碼,可以做多條件聯(lián)合查詢，這里只是做一個(gè)簡(jiǎn)單的查詢。歡迎拍磚，有問(wèn)題的還望大蝦們斧正哈。看看這個(gè)效果圖，無(wú)刷新的噢?。?

具體實(shí)現(xiàn)請(qǐng)看源碼：

1、aspx頁(yè)面

復(fù)制代碼代碼如下:

 
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="AjaxPage.aspx.cs" Inherits="MeasurementWellCurve.UI.AjaxPage" %> 
<!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> 
<title>ajax分頁(yè)</title> 
<link href="../CSS/tb_Style.css" rel="stylesheet" type="text/css" /> 
<script src="../JS/jquery-1.4.2.min.js" type="text/javascript"></script> 
</head> 
<body> 
<form id="form1" runat="server"> 
<div id="divLayer"> 
<div> 
編號(hào)：<asp:TextBox ID="txtCSBH" runat="server"></asp:TextBox><input id="btnSearch" type="button" 
value="查詢" /> 
</div> 
<table id="jgcsTable" class="listTable" cellpadding="0" cellspacing="0"> 
<thead> 
<tr> 
<th> 
測(cè)試編號(hào) 
</th> 
<th> 
地層滲透率K 
</th> 
<th> 
井筒儲(chǔ)集常數(shù)C 
</th> 
<th> 
表皮系數(shù)S 
</th> 
<th> 
堵塞比 
</th> 
<th> 
探測(cè)半徑 
</th> 
<th> 
擬合地層壓力 
</th> 
<th> 
邊界距離 
</th> 
<th> 
壓力系數(shù) 
</th> 
<th> 
復(fù)合儲(chǔ)能比 
</th> 
<th> 
操作 
</th> 
</tr> 
</thead> 
<tbody id="tb_body"> 
</tbody> 
<tfoot id="load"> 
<tr> 
<td align="center" colspan="11"> 
<img src="../images/loading.gif" /> 
</td> 
</tr> 
</tfoot> 
</table> 
<div class="navigation"> 
<div style="text-align: left; float: left; width: 260px;"> 
共<label id="lblToatl"></label>條數(shù)據(jù) 第[<label id="lblCurent"></label>]頁(yè)/共[<label id="lblPageCount">0</label>]頁(yè) 
</div> 
<div style="text-align: right; float: right;"> 
<a id="first" href="#">首頁(yè)</a> <a id="previous" href="#">上一頁(yè)</a> <a id="next" href="#"> 
下一頁(yè)</a> <a id="last" href="#">末頁(yè)</a> 
</div> 
</div> 
</div> 
</form> 
</body> 
</html> 

2、具體實(shí)現(xiàn)JS

復(fù)制代碼代碼如下:

 
var pageIndex = 1; //頁(yè)索引 
var where = " where 1=1"; 
$(function() { 
BindData(); 
// GetTotalCount(); //總記錄條數(shù) 
//GetPageCount(); //總頁(yè)數(shù)綁定 
//第一頁(yè)按鈕click事件 
$("#first").click(function() { 
pageIndex = 1; 
$("#lblCurent").text(1); 
BindData(); 
}); 
//上一頁(yè)按鈕click事件 
$("#previous").click(function() { 
if (pageIndex != 1) { 
pageIndex--; 
$("#lblCurent").text(pageIndex); 
} 
BindData(); 
}); 
//下一頁(yè)按鈕click事件 
$("#next").click(function() { 
var pageCount = parseInt($("#lblPageCount").text()); 
if (pageIndex != pageCount) { 
pageIndex++; 
$("#lblCurent").text(pageIndex); 
} 
BindData(); 
}); 
//最后一頁(yè)按鈕click事件 
$("#last").click(function() { 
var pageCount = parseInt($("#lblPageCount").text()); 
pageIndex = pageCount; 
BindData(); 
}); 
//查詢 
$("#btnSearch").click(function() { 
where = " where 1=1"; 
var csbh = $("#txtCSBH").val(); 
if (csbh != null && csbh != NaN) { 
pageIndex = 1; 
where += " and csbh like '%" + csbh + "%'"; 
} 
BindData(); 
}); 
}) 
//AJAX方法取得數(shù)據(jù)并顯示到頁(yè)面上 
function BindData() { 
$.ajax({ 
type: "get", //使用get方法訪問(wèn)后臺(tái) 
dataType: "json", //返回json格式的數(shù)據(jù) 
url: "../AjaxService/JgcsService.ashx", //要訪問(wèn)的后臺(tái)地址 
data: { "pageIndex": pageIndex, "where": where }, //要發(fā)送的數(shù)據(jù) 
ajaxStart: function() { $("#load").show(); }, 
complete: function() { $("#load").hide(); }, //AJAX請(qǐng)求完成時(shí)隱藏loading提示 
success: function(msg) {//msg為返回的數(shù)據(jù)，在這里做數(shù)據(jù)綁定 
var data = msg.table; 
if (data.length != 0) { 
var t = document.getElementById("tb_body"); //獲取展示數(shù)據(jù)的表格 
while (t.rows.length != 0) { 
t.removeChild(t.rows[0]); //在讀取數(shù)據(jù)時(shí)如果表格已存在行．一律刪除 
} 
} 
$.each(data, function(i, item) { 
$("#jgcsTable").append("<tr><td>" + item.CSBH + "</td><td>" + item.K + "&nbsp;</td><td>" + item.C + 
"&nbsp;</td><td>" + item.S + "&nbsp;</td><td>" + item.DSB + "&nbsp;</td><td>" + item.TCBJ + 
"</td><td>" + item.LHDCYL + "&nbsp;</td><td>" + item.BJJL + "</td><td>" + item.YLXS + 
"&nbsp;</td><td>" + item.FCTH + "&nbsp;</td><td><a href='AjaxPaging.htm' target='blank'>" + 
"<img src='../images/icon_06.gif' alt='查看詳細(xì)信息'" + 
"id='btnInsert'style='border-width:0px;' /></a></td></tr>"); 
}) 
}, 
error: function() { 
var t = document.getElementById("tb_body"); //獲取展示數(shù)據(jù)的表格 
while (t.rows.length != 0) { 
t.removeChild(t.rows[0]); //在讀取數(shù)據(jù)時(shí)如果表格已存在行．一律刪除 
} 
alert("加載數(shù)據(jù)失敗"); 
} //加載失敗，請(qǐng)求錯(cuò)誤處理 
//ajaxStop:$("#load").hide() 
}); 
GetTotalCount(); 
GetPageCount(); 
bindPager(); 
} 
// 頁(yè)腳屬性設(shè)置 
function bindPager() { 
//填充分布控件信息 
var pageCount = parseInt($("#lblPageCount").text()); //總頁(yè)數(shù) 
if (pageCount == 0) { 
document.getElementById("lblCurent").innerHTML = "0"; 
} 
else { 
if (pageIndex > pageCount) { 
$("#lblCurent").text(1); 
} 
else { 
$("#lblCurent").text(pageIndex); //當(dāng)前頁(yè) 
} 
} 
document.getElementById("first").disabled = (pageIndex == 1 || $("#lblCurent").text() == "0") ? true : false; 
document.getElementById("previous").disabled = (pageIndex <= 1 || $("#lblCurent").text() == "0") ? true : false; 
document.getElementById("next").disabled = (pageIndex >= pageCount) ? true : false; 
document.getElementById("last").disabled = (pageIndex == pageCount || $("#lblCurent").text() == "0") ? true : false; 
} 
//AJAX方法取得總頁(yè)數(shù) 
function GetPageCount() { 
var pageCount; 
$.ajax({ 
type: "get", 
dataType: "text", 
url: "../AjaxService/JgcsService.ashx", 
data: { "wherePageCount": where }, //"wherePageCount" + where,個(gè)人建議不用這種方式 
async: false, 
success: function(msg) { 
document.getElementById("lblPageCount").innerHTML = msg; 
} 
}); 
} 
//AJAX方法取得記錄總數(shù) 
function GetTotalCount() { 
var pageCount; 
$.ajax({ 
type: "get", 
dataType: "text", 
url: "../AjaxService/JgcsService.ashx", 
data: { "whereCount": where }, 
async: false, 
success: function(msg) { 
document.getElementById("lblToatl").innerHTML = msg; 
} 
}); 
} 

3、一般處理程序ashx中的代碼

復(fù)制代碼代碼如下:

 
public class JgcsService : IHttpHandler 
{ 
readonly int pageSize = 15; 
public void ProcessRequest(HttpContext context) 
{ 
context.Response.ContentType = "text/plain"; 
//不讓瀏覽器緩存 
context.Response.Buffer = true; 
context.Response.ExpiresAbsolute = DateTime.Now.AddDays(-1); 
context.Response.AddHeader("pragma", "no-cache"); 
context.Response.AddHeader("cache-control", ""); 
context.Response.CacheControl = "no-cache"; 
string result = ""; 
//記錄總條數(shù) 
if (!string.IsNullOrEmpty(context.Request["whereCount"])) 
{ 
string where = context.Request.Params["whereCount"].ToString(); 
result = Jgcs.GetToatlNum(where).ToString(); 
} 
//總頁(yè)數(shù) 
if (!string.IsNullOrEmpty(context.Request["wherePageCount"])) 
{ 
string where = context.Request.Params["wherePageCount"].ToString(); 
int count = Jgcs.GetToatlNum(where); 
string pageCount = Math.Ceiling((double)count / (double)pageSize).ToString(); 
result = pageCount; 
} 
//分頁(yè)數(shù)據(jù) 
if (!string.IsNullOrEmpty(context.Request.Params["pageIndex"]) 
&& !string.IsNullOrEmpty(context.Request.Params["where"])) 
{ 
string where = context.Request.Params["where"].ToString(); 
int pageIndex = Convert.ToInt32(context.Request.Params["pageIndex"]); 
result = GetJsonString(where, pageIndex); 
} 
context.Response.Write(result); 
} 
/// <summary> 
/// 返回json串 
/// </summary> 
/// <param name="where">查詢條件</param> 
/// <param name="pageIndex">頁(yè)面索引</param> 
/// <returns>json串</returns> 
protected string GetJsonString(string where, int pageIndex) 
{ 
DataTable dt = Jgcs.GetInfo("csbh", where, pageIndex, pageSize); 
return JsonHelper.DataTable2Json(dt, "table"); 
} 
public bool IsReusable 
{ 
get 
{ 
return false; 
} 
} 
} 

4、分頁(yè)查詢的方法可看可不看了，都會(huì)這個(gè)吧，做示例簡(jiǎn)單的開了個(gè)頭，應(yīng)用時(shí)在處理方面可不要這么去寫噢，貼下來(lái)僅做一個(gè)參考
分頁(yè)方法

復(fù)制代碼代碼如下:

 
/// <summary> 
/// 分頁(yè)查詢的方法 
/// </summary> 
/// <param name="orderFile">排序字段</param> 
/// <param name="where">查詢條件</param> 
/// <param name="pageNumber">當(dāng)前頁(yè)</param> 
/// <param name="pageSize">頁(yè)大小</param> 
/// <returns></returns> 
public static DataTable GetInfo(string orderFile, string where, int pageNumber, int pageSize) 
{ 
DBHelper db = new DBHelper(); 
string str = @"with TestInfo as 
( 
select row_number() over(order by {0} desc) as rowNumber,* from 
(select CSBH,K,C,S,DSB,TCBJ,LHDCYL,BJJL,BJLX,YLXS,FCTH,KHM1,KHM2,QKCS from YW_JGCS) temp {1} 
) 
select * from TestInfo 
where rowNumber between (({2}-1)*{3}+1) and {2}*{3}"; 
string strSql = string.Format(str, orderFile, where, pageNumber, pageSize); 
try 
{ 
db.DBOpen(); 
return db.DbDataSet(strSql); 
} 
catch (Exception ex) 
{ 
throw ex; 
} 
finally 
{ 
db.DBClose(); 
} 
} 
/// <summary> 
/// 結(jié)果參數(shù)總條數(shù) 
/// </summary> 
/// <param name="where"></param> 
/// <returns></returns> 
public static int GetToatlNum(string where) 
{ 
DBHelper db = new DBHelper(); 
string strSql = string.Format(@"select count(*) from (select CSBH,K,C,S,DSB,TCBJ,LHDCYL,BJJL,BJLX,YLXS,FCTH,KHM1,KHM2,QKCS from YW_JGCS) temp {0}", where); 
try 
{ 
db.DBOpen(); 
return (int)db.ExecuteScalar(strSql); 
} 
catch (Exception ex) 
{ 
throw ex; 
} 
finally 
{ 
db.DBClose(); 
} 
} 