Ajax實現分頁查詢

由於查詢返回的資料量很大，超過10w條資料，因此需要對頁面查詢功能進行優化。放棄原有程式中使用datagrid的做法，自己編寫分頁顯示模組。

首先在頁面上新增幾個div:

用於顯示查詢回的資料

用於顯示分頁的頁碼

用於顯示前一頁、後一頁、...、首頁、尾頁等控制按鈕

用於顯示當前頁的頁碼

實現客戶端分頁函式：

var curpage=0; //當前頁

var totalpage=0; //總頁數

var pagetab=7; //每組顯示頁數

var curtab=0; //當前分組

我的程式是設定每頁顯示50條資料，每組顯示7頁，這些可以按需求調整。

turntab函式用於切換分組，根據傳入的val來計算顯示哪一組頁面。val=1表示切換到下一組，val=-1表示切換到上一組，0表示切換到第一組，-2表示切換到最後一組。使用者通過單擊頁面上的

... 符號來切換分組。

function turntab(val)

else if (val == -1)

else if (val == 0)

else if (val == -2)

var carinfo = document.getelementbyid("div_trackpages");

var tabinfo = document.getelementbyid("div_trackpagetab");

var strinner = "";

strinner += "首頁 ";

strinner += "前一頁 ";

strinner += "總共" + totalpage + "頁 ";

strinner += "尾頁 ";

tabinfo.innerhtml = strinner;

strinner = "";

if (curtab > 1) strinner += "... ";

for ( ; npage<=curtab*pagetab; npage++)

}if (npage < totalpage) strinner += "... ";

carinfo.innerhtml = strinner;

}turnpage函式用於切換分頁，val表示要切換到的頁數，根據要顯示的頁數生成查詢範圍，如查詢前50條記錄，從51到100的記錄，從101到150的記錄。。。

csccustomanalyst是乙個非同步呼叫函式，函式實現的**將在下面貼出。"method","sid", "time1", "time2", "row1", "row2"都是執行查詢所需的引數，method是用來判斷要執行什麼查詢，"row1", "row2"表示要查詢的記錄範圍，其他的引數就根據實際需要進行調整。showcartrack(val)是乙個對查詢結果進行處理的函式，非同步呼叫完成後得到的結果就將在這個函式中分析處理並且顯示。這部分**按照具體實現編寫，我這裡就不列出。

function turnpage(val)

}function nextpage()}}

turnpage實現，

function previouspage()}}

_csccustomanalyst是非同步呼叫函式，xhr.open("post","mapquery.ashx", true);這段話是表示將請求提交到

mapquery.ashx這個頁面。所有的伺服器段資料庫操作都在

mapquery.ashx裡面執行。

function _csccustomanalyst(paramnames, paramvalues, oncomplete, onerror)

if(oncomplete)

}else

}xhr.onreadystatechange = function(){};

xhr = null;}};

var paramstring=null;

if(paramnames&¶mnames.length>0)

paramstring = params.join("&");

}xhr.send(paramstring);

};最後列出乙個oracle的按數量範圍查詢的sql語句：(查詢前50條記錄)

select *

from (select /*+ full(tablename)*/ fieldname, rownum rn from

tablename

where condition and rownum <= 50 order by field desc) t2 where t2.rn >= 1;

完

Ajax實現分頁查詢

ajax實現分頁和分頁查詢

ajax實現資料分頁查詢

ajax實現分頁

Ajax實現分頁查詢

ajax實現分頁和分頁查詢

ajax實現資料分頁查詢

ajax實現分頁

相關推薦