最新国产好看的视频,伊人天堂AV在线,国产Aaaaaa视频,蜜臀视频在线观看一区,人妻av色图,密臀久久久精品影片,青青视频免费观看毛片,久草在线观看视,国产三级精品色情在线

用jQuery中的ajax分頁實現代碼

 更新時間:2011年09月20日 22:10:49   作者:  
去年的時候剛接觸Jquery,也就做界面特效用了下,對其很有興趣,迫于現在項目中不怎么用,對其甚是想念呀,這不沒抽點時間再來看看Juery中好玩的東西。
功能簡介:主要功能就是分頁顯示數據了,可在配置文件中配置每頁要顯示的頁碼,可以做多條件聯合查詢,這里只是做一個簡單的查詢。歡迎拍磚,有問題的還望大蝦們斧正哈??纯催@個效果圖,無刷新的噢!!

具體實現請看源碼:

1、aspx頁面

復制代碼 代碼如下:

<%@ 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分頁</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>
編號:<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>
測試編號
</th>
<th>
地層滲透率K
</th>
<th>
井筒儲集常數C
</th>
<th>
表皮系數S
</th>
<th>
堵塞比
</th>
<th>
探測半徑
</th>
<th>
擬合地層壓力
</th>
<th>
邊界距離
</th>
<th>
壓力系數
</th>
<th>
復合儲能比
</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>條數據 第[<label id="lblCurent"></label>]頁/共[<label id="lblPageCount">0</label>]頁
</div>
<div style="text-align: right; float: right;">
<a id="first" href="#">首頁</a> <a id="previous" href="#">上一頁</a> <a id="next" href="#">
下一頁</a> <a id="last" href="#">末頁</a>
</div>
</div>
</div>
</form>
</body>
</html>

2、具體實現JS
復制代碼 代碼如下:

var pageIndex = 1; //頁索引
var where = " where 1=1";
$(function() {
BindData();
// GetTotalCount(); //總記錄條數
//GetPageCount(); //總頁數綁定
//第一頁按鈕click事件
$("#first").click(function() {
pageIndex = 1;
$("#lblCurent").text(1);
BindData();
});
//上一頁按鈕click事件
$("#previous").click(function() {
if (pageIndex != 1) {
pageIndex--;
$("#lblCurent").text(pageIndex);
}
BindData();
});
//下一頁按鈕click事件
$("#next").click(function() {
var pageCount = parseInt($("#lblPageCount").text());
if (pageIndex != pageCount) {
pageIndex++;
$("#lblCurent").text(pageIndex);
}
BindData();
});
//最后一頁按鈕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方法取得數據并顯示到頁面上
function BindData() {
$.ajax({
type: "get", //使用get方法訪問后臺
dataType: "json", //返回json格式的數據
url: "../AjaxService/JgcsService.ashx", //要訪問的后臺地址
data: { "pageIndex": pageIndex, "where": where }, //要發(fā)送的數據
ajaxStart: function() { $("#load").show(); },
complete: function() { $("#load").hide(); }, //AJAX請求完成時隱藏loading提示
success: function(msg) {//msg為返回的數據,在這里做數據綁定
var data = msg.table;
if (data.length != 0) {
var t = document.getElementById("tb_body"); //獲取展示數據的表格
while (t.rows.length != 0) {
t.removeChild(t.rows[0]); //在讀取數據時如果表格已存在行.一律刪除
}
}
$.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='查看詳細信息'" +
"id='btnInsert'style='border-width:0px;' /></a></td></tr>");
})
},
error: function() {
var t = document.getElementById("tb_body"); //獲取展示數據的表格
while (t.rows.length != 0) {
t.removeChild(t.rows[0]); //在讀取數據時如果表格已存在行.一律刪除
}
alert("加載數據失敗");
} //加載失敗,請求錯誤處理
//ajaxStop:$("#load").hide()
});
GetTotalCount();
GetPageCount();
bindPager();
}
// 頁腳屬性設置
function bindPager() {
//填充分布控件信息
var pageCount = parseInt($("#lblPageCount").text()); //總頁數
if (pageCount == 0) {
document.getElementById("lblCurent").innerHTML = "0";
}
else {
if (pageIndex > pageCount) {
$("#lblCurent").text(1);
}
else {
$("#lblCurent").text(pageIndex); //當前頁
}
}
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方法取得總頁數
function GetPageCount() {
var pageCount;
$.ajax({
type: "get",
dataType: "text",
url: "../AjaxService/JgcsService.ashx",
data: { "wherePageCount": where }, //"wherePageCount" + where,個人建議不用這種方式
async: false,
success: function(msg) {
document.getElementById("lblPageCount").innerHTML = msg;
}
});
}
//AJAX方法取得記錄總數
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中的代碼
復制代碼 代碼如下:

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 = "";
//記錄總條數
if (!string.IsNullOrEmpty(context.Request["whereCount"]))
{
string where = context.Request.Params["whereCount"].ToString();
result = Jgcs.GetToatlNum(where).ToString();
}
//總頁數
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;
}
//分頁數據
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">頁面索引</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、分頁查詢的方法可看可不看了,都會這個吧,做示例簡單的開了個頭,應用時在處理方面可不要這么去寫噢,貼下來僅做一個參考
分頁方法
復制代碼 代碼如下:

/// <summary>
/// 分頁查詢的方法
/// </summary>
/// <param name="orderFile">排序字段</param>
/// <param name="where">查詢條件</param>
/// <param name="pageNumber">當前頁</param>
/// <param name="pageSize">頁大小</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>
/// 結果參數總條數
/// </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();
}
}

好了,代碼就這么多

相關文章

最新評論

嫩江县| 新乡市| 扬州市| 吉安市| 华阴市| 临汾市| 沙洋县| 砚山县| 泰和县| 宁化县| 公主岭市| 张家界市| 华安县| 西乌珠穆沁旗| 墨脱县| 天等县| 富裕县| 新蔡县| 怀来县| 丹巴县| 会理县| 成武县| 卓资县| 林州市| 深水埗区| 古浪县| 香河县| 庆云县| 黄陵县| 江北区| 临沧市| 龙游县| 牡丹江市| 高清| 曲水县| 福安市| 遵义市| 白城市| 商洛市| 宝兴县| 大港区|