Ajax mengimplementasikan permintaan paging

Karena jumlah data yang dikembalikan oleh kueri besar, lebih dari 100.000 data, fungsi kueri halaman perlu dioptimalkan. Abaikan praktik penggunaan DataGrid di program asli dan tulis sendiri modul tampilan paging.
Pertama tambahkan beberapa DIV ke halaman:

<div id="div_trackpoint" style=" border:solid 1px grey; height:230px; width:99%; overflow-y:auto;">Digunakan untuk menampilkan data yang dikembalikan oleh kueri</div>
<div id="div_trackpages" style=" height:15px; width:99%; font-size:8pt; word-break:break-all; word-wrap: break-word;">Nomor halaman yang digunakan untuk menampilkan paging< /div><br />
<div id="div_trackpagetab" style=" height:15px; width:99%; font-size:8pt; text-align:center;">Digunakan untuk menampilkan halaman sebelumnya, halaman berikutnya,..., halaman beranda, Halaman terakhir dan tombol kontrol lainnya</div>
<div id="div_trackpage_status" style=" height:20px; width:99%; font-size:8pt; text-align:center;">Digunakan untuk menampilkan nomor halaman dari halaman saat ini</div>

mengimplementasikan klien fungsi paging:
var CurPage=0; //Halaman saat ini
var TotalPage=0; //Jumlah total halaman
var PageTab=7; //Jumlah halaman yang ditampilkan di setiap grup
var CurTab=0; //Pengelompokan saat ini

Program saya diatur untuk menampilkan 50 data per halaman dan 7 halaman per grup.

Fungsi TurnTab digunakan untuk berpindah grup dan menghitung grup halaman mana yang akan ditampilkan berdasarkan nilai yang diteruskan. val=1 berarti beralih ke grup berikutnya, val=-1 berarti beralih ke grup sebelumnya, 0 berarti beralih ke grup pertama, dan -2 berarti beralih ke grup terakhir. Pengguna berpindah grup dengan mengklik simbol ... di halaman.

fungsi TurnTab(val)
{
var nHalaman = 0;

jika (val == 1) {
Tab Batas++;
nPage = (CurTab - 1) * PageTab + 1;
}
lain jika (val == -1) {
Tab Batas--;
nPage = (CurTab - 1) * PageTab + 1;
}
lain jika (val == 0) {
Tab Batas = 1;
nHalaman = 1;
}
lain jika (val == -2) {
CurTab = Matematika.lantai(TotalPage / PageTab) + 1;
nPage = (CurTab - 1) * PageTab + 1;
}

var carinfo = document.getElementById("div_trackpages");
var tabinfo = dokumen.getElementById("div_trackpagetab");

var strInner = "";

strInner += "<a href="javascript:TurnPage(1)">Beranda</a>&nbsp;";

strInner += "<a href="javascript:PviousPage()">Halaman sebelumnya</a>&nbsp;";

strInner += "Total" + TotalHalaman + "Halaman&nbsp;";

strInner += "<a href="javascript:NextPage()">Halaman berikutnya</a>&nbsp;";

strInner += "<a href="javascript:TurnPage(" + TotalPage + ")">Halaman Terakhir</a>&nbsp;";

tabinfo.innerHTML = strInner;

strInner = "";

if (CurTab > 1) strInner += "<a href="javascript:TurnTab(-1)">...</a>&nbsp;";

untuk ( ; nPage<=CurTab*PageTab; nPage++) {

jika (nHalaman <= TotalHalaman) {

strInner += "<a href="javascript:TurnPage("+ nPage + ")">"+nPage+"</a>&nbsp;"

}
}

if (nPage < TotalPage) strInner += "<a href="javascript:TurnTab(1)">...</a>&nbsp;";

carinfo.innerHTML = strInner;

}

Fungsi TurnPage digunakan untuk berpindah halaman, val mewakili jumlah halaman yang akan dialihkan, dan rentang kueri dihasilkan berdasarkan jumlah halaman yang akan ditampilkan, seperti menanyakan 50 catatan pertama, catatan dari 51 hingga 100, dan catatan dari 101 hingga 150. . .
cscCustomAnalyst adalah fungsi panggilan asinkron, dan kode untuk implementasi fungsi akan diposting di bawah. "Metode", "SID", "TIME1", "TIME2", "ROW1", "ROW2" adalah semua parameter yang diperlukan untuk mengeksekusi kueri. Metode digunakan untuk menentukan kueri apa yang akan dieksekusi, "ROW1", "ROW2" artinya Kisaran record yang akan ditanyakan, dan parameter lainnya dapat disesuaikan dengan kebutuhan sebenarnya. ShowCarTrack(val) adalah fungsi yang memproses hasil kueri. Hasil yang diperoleh setelah panggilan asinkron selesai akan dianalisis, diproses, dan ditampilkan dalam fungsi ini. Bagian kode ini ditulis sesuai dengan implementasi spesifiknya, jadi saya tidak akan mencantumkannya di sini.

fungsi Halaman Putar(val)
{
if (Nomor(val) != CurPage) {

CurPage = Angka(val);

var baris1 = String((CurPage - 1) * 50 + 1);
var baris2 = String(Halaman Curang * 50);

var trackinfo = document.getElementById("div_trackpoint");
trackinfo.innerHTML = "Mengambil data, harap tunggu...";

_cscCustomAnalyst(["Metode", "SID", "TIME1", "TIME2", "ROW1", "ROW2"],
["GetCarTrack",, "80100117", t1, t2, baris1, baris2],
TampilkanCarTrack,onQueryError);

jika (CurPage == 1) TurnTab(0);

jika (CurPage == TotalPage) TurnTab(-2);

var statusinfo = document.getElementById("div_trackpage_status");

statusinfo.innerHTML = "Halaman" + CurPage + "Halaman";
}

}

NextPage beralih ke halaman berikutnya dan memanggil TurnPage untuk mengimplementasikannya. Jika halaman berikutnya melebihi grup saat ini, halaman tersebut harus beralih ke grup berikutnya.

fungsiHalaman Berikutnya()
{
if (CurPage < TotalPage) {

TurnPage(CurPage+1);

if ((CurPage + 1) > (CurTab * PageTab)) {
PutarTab(1);
}
}

}

PreviousPage beralih ke halaman sebelumnya dan memanggil TurnPage untuk mengimplementasikannya. Jika halaman sebelumnya melebihi grup saat ini, halaman tersebut harus beralih ke grup sebelumnya.
fungsi Halaman Sebelumnya()
{
if (CurPage > 1) {

TurnPage(CurPage-1);

if ((CurPage - 1) <= ((CurTab - 1) * PageTab)) {
PutarTab(-1);
}

}
}

_cscCustomAnalyst adalah fungsi panggilan asinkron, xhr.open("post","MapQuery.ashx", true); Paragraf ini berarti mengirimkan permintaan ke halaman MapQuery.ashx. Semua operasi database segmen server dilakukan di MapQuery.ashx.

fungsi _cscCustomAnalyst(paramNames, paramValues, onComplete, onError){

var xhr=_GetXmlHttpRequest();

xhr.open("post","MapQuery.ashx", true);

xhr.setRequestHeader("Jenis Konten", "application/x-www-form-urlencoded");

xhr.onreadystatechange=fungsi(){

var readyState=xhr.readyState;

jika (kondisi siap==4){

var status=xhr.status;

jika(status==200){

var hasil yang ditetapkan = xhr.responseText;

jika(hasil yang ditetapkan == null){
onComplete(null);
kembali;
}

if(sedang Selesai){
onComplete(kumpulan hasil);
hasil = null;
}
}
kalau tidak{
jika(padaKesalahan){
onError(xhr.responseText);
}
}

xhr.onreadystatechange = fungsi(){};

xjam = nol;
}
};

var paramString=null;

if(paramNames&&paramNames.panjang>0){

var params = Array baru();

while(paramNames&&paramNames.panjang>0)
{
params.push(paramNames.shift()+"="+_ToJSON(paramValues.shift()));
}

paramString = params.join("&");

}

xhr.kirim(paramString);
};

Terakhir, buat daftar pernyataan Oracle SQL yang dikueri berdasarkan rentang kuantitas: (kueri 50 catatan pertama)
PILIH *
FROM (SELECT /*+ FULL(tablename)*/ fieldname, ROWNUM rn FROM tablename WHERE condition AND ROWNUM <= 50 ORDER BY field DESC) t2 dimana t2.rn >= 1;