Ajax ใช้แบบสอบถามเพจจิ้ง

เนื่องจากปริมาณข้อมูลที่ส่งคืนโดยการสืบค้นมีขนาดใหญ่ จึงมีข้อมูลมากกว่า 100,000 ชิ้น ฟังก์ชันการสืบค้นหน้าจึงต้องได้รับการปรับให้เหมาะสม ละทิ้งแนวทางการใช้ DataGrid ในโปรแกรมดั้งเดิมและเขียนโมดูลการแสดงเพจด้วยตนเอง
ขั้นแรกให้เพิ่ม DIV สองสามรายการลงในเพจ:

<div id="div_trackpoint" style=" border:solid 1px grey; height:230px; width:99%; overflow-y:auto;">ใช้เพื่อแสดงข้อมูลที่ส่งคืนโดยการสืบค้น</div>
<div id="div_trackpages" style=" height:15px; width:99%; font-size:8pt; word-break:break-all; word-wrap: break-word;">หมายเลขหน้าที่ใช้ในการแสดงเพจ< /div><br />
<div id="div_trackpagetab" style=" height:15px; width:99%; font-size:8pt; text-align:center;">ใช้เพื่อแสดงหน้าก่อนหน้า, หน้าถัดไป,..., หน้าแรก, หน้าสุดท้ายและปุ่มควบคุมอื่นๆ</div>
<div id="div_trackpage_status" style=" height:20px; width:99%; font-size:8pt; text-align:center;">ใช้เพื่อแสดงหมายเลขหน้าของหน้าปัจจุบัน</div>

ใช้งานไคลเอนต์ ฟังก์ชั่นเพจ:
var CurPage=0; //หน้าปัจจุบัน
var TotalPage=0; //จำนวนหน้าทั้งหมด
var PageTab=7; //จำนวนหน้าที่แสดงในแต่ละกลุ่ม
var CurTab=0; //การจัดกลุ่มปัจจุบัน

โปรแกรมของฉันถูกตั้งค่าให้แสดงข้อมูล 50 ชิ้นต่อหน้าและ 7 หน้าต่อกลุ่ม ซึ่งสามารถปรับได้ตามต้องการ

ฟังก์ชัน TurnTab ใช้เพื่อสลับกลุ่มและคำนวณว่าจะแสดงกลุ่มของเพจใดโดยพิจารณาจากค่าที่ส่ง val=1 หมายถึง การสลับไปยังกลุ่มถัดไป val=-1 หมายถึง การสลับไปยังกลุ่มก่อนหน้า 0 หมายถึง การสลับไปยังกลุ่มแรก และ -2 หมายถึง การสลับไปยังกลุ่มสุดท้าย ผู้ใช้สลับกลุ่มโดยคลิกสัญลักษณ์ ... บนเพจ

ฟังก์ชั่น TurnTab (วาล)
-
var nPage = 0;

ถ้า (วาล == 1) {
CurTab++;
nPage = (CurTab - 1) * แท็บเพจ + 1;
-
อื่นถ้า (val == -1) {
CurTab--;
nPage = (CurTab - 1) * แท็บเพจ + 1;
-
อย่างอื่นถ้า (val == 0) {
CurTab = 1;
nเพจ = 1;
-
อื่นถ้า (val == -2) {
CurTab = Math.floor(TotalPage / PageTab) + 1;
nPage = (CurTab - 1) * แท็บเพจ + 1;
-

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

var strInner = "";

strInner += "<a href="javascript:TurnPage(1)">หน้าแรก</a>&nbsp;";

strInner += "<a href="javascript:PreviousPage()">หน้าก่อนหน้า</a>&nbsp;";

strInner += "ทั้งหมด" + TotalPage + "หน้า&nbsp;";

strInner += "<a href="javascript:NextPage()">หน้าถัดไป</a>&nbsp;";

strInner += "<a href="javascript:TurnPage(" + TotalPage + ")">หน้าสุดท้าย</a>&nbsp;";

tabinfo.innerHTML = strInner;

strInner = "";

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

สำหรับ ( ; nPage<=CurTab*PageTab; nPage++) {

ถ้า (nPage <= TotalPage) {

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

-
-

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

carinfo.innerHTML = strInner;

}

ฟังก์ชัน TurnPage ใช้เพื่อสลับเพจ โดย val แสดงถึงจำนวนเพจที่จะสลับไป และช่วงการสืบค้นจะถูกสร้างขึ้นตามจำนวนเพจที่จะแสดง เช่น การสืบค้น 50 เรคคอร์ดแรก เรคคอร์ดตั้งแต่ 51 ถึง 100 และบันทึกตั้งแต่ 101 ถึง 150 - -
cscCustomAnalyst เป็นฟังก์ชันการเรียกแบบอะซิงโครนัส และโค้ดสำหรับการใช้งานฟังก์ชันจะโพสต์ไว้ด้านล่าง "Method", "SID", "TIME1", "TIME2", "ROW1", "ROW2" คือพารามิเตอร์ทั้งหมดที่จำเป็นสำหรับการดำเนินการสืบค้น Method ใช้เพื่อกำหนดว่าแบบสอบถามใดที่จะดำเนินการ "ROW1", "ROW2" ช่วงของบันทึกที่จะสอบถาม และพารามิเตอร์อื่นๆ สามารถปรับเปลี่ยนได้ตามความต้องการที่แท้จริง ShowCarTrack(val) เป็นฟังก์ชันที่ประมวลผลผลลัพธ์การสืบค้น ผลลัพธ์ที่ได้รับหลังจากการเรียกแบบอะซิงโครนัสเสร็จสิ้นจะถูกวิเคราะห์ ประมวลผล และแสดงในฟังก์ชันนี้ โค้ดส่วนนี้เขียนขึ้นตามการใช้งานเฉพาะ ดังนั้นฉันจะไม่แสดงรายการไว้ที่นี่

ฟังก์ชั่น TurnPage (วาล)
-
ถ้า (หมายเลข (val) != CurPage) {

CurPage = จำนวน (val);

var row1 = สตริง((CurPage - 1) * 50 + 1);
var row2 = สตริง(CurPage * 50);

var trackinfo = document.getElementById("div_trackpoint");
trackinfo.innerHTML = "กำลังรับข้อมูล โปรดรอสักครู่...";

_cscCustomAnalyst(["วิธีการ", "SID", "TIME1", "TIME2", "ROW1", "ROW2"],
["GetCarTrack",, "80100117", t1, t2, แถว1, แถว2],
ShowCarTrack,onQueryError);

ถ้า (CurPage == 1) TurnTab (0);

ถ้า (CurPage == TotalPage) TurnTab (-2);

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

statusinfo.innerHTML = "หน้า" + CurPage + "หน้า";
}

}

NextPage สลับไปที่หน้าถัดไปและเรียก TurnPage เพื่อนำไปใช้ หากหน้าถัดไปเกินกลุ่มปัจจุบัน จะต้องสลับไปยังกลุ่มถัดไป

ฟังก์ชั่นNextPage()
-
ถ้า (CurPage < TotalPage) {

เทิร์นเพจ(CurPage+1);

ถ้า ((CurPage + 1) > (CurTab * PageTab)) {
เทิร์นแท็บ(1);
-
-

}

PreviousPage สลับไปที่หน้าก่อนหน้าและเรียก TurnPage เพื่อนำไปใช้ หากหน้าก่อนหน้าเกินกลุ่มปัจจุบัน จะต้องสลับไปยังกลุ่มก่อนหน้า
ฟังก์ชั่นหน้าก่อนหน้า()
-
ถ้า (CurPage > 1) {

TurnPage (CurPage-1);

ถ้า ((CurPage - 1) <= ((CurTab - 1) * PageTab)) {
เทิร์นแท็บ(-1);
-

-
}

_cscCustomAnalyst เป็นฟังก์ชันการเรียกแบบอะซิงโครนัส xhr.open("post", "MapQuery.ashx", true); ย่อหน้านี้หมายถึงการส่งคำขอไปยังหน้า MapQuery.ashx การดำเนินการฐานข้อมูลเซ็กเมนต์เซิร์ฟเวอร์ทั้งหมดดำเนินการใน MapQuery.ashx

ฟังก์ชั่น _cscCustomAnalyst (paramNames, paramValues, onComplete, onError){

var xhr=_GetXmlHttpRequest();

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

xhr.setRequestHeader("ประเภทเนื้อหา", "application/x-www-form-urlencoded");

xhr.onreadystatechange=ฟังก์ชั่น(){

var readyState=xhr.readyState;

ถ้า (พร้อมสถานะ==4){

สถานะ var=xhr.status;

ถ้า (สถานะ==200){

ผลลัพธ์ var = xhr.responseText;

ถ้า (ชุดผลลัพธ์ == null){
เมื่อเสร็จสิ้น(null);
กลับ;
}

ถ้า(เมื่อเสร็จสมบูรณ์){
onComplete (ชุดผลลัพธ์);
ชุดผลลัพธ์ = null;
-
-
อื่น{
ถ้า(onError){
onError(xhr.ข้อความตอบกลับ);
-
-

xhr.onreadystatechange = ฟังก์ชั่น(){};

xhr = โมฆะ;
-
-

var paramString=null;

ถ้า(paramNames&&paramNames.length>0){

var params = อาร์เรย์ใหม่ ();

ในขณะที่ (paramNames&&paramNames.length>0)
-
params.push(paramNames.shift()+"="+_ToJSON(paramValues.shift()));
-

paramString = params.join("&");

-

xhr.send(paramString);
};

สุดท้ายนี้ ให้แสดงรายการคำสั่ง Oracle SQL ที่สืบค้นตามช่วงปริมาณ: (สืบค้น 50 ระเบียนแรก)
เลือก *
FROM (SELECT /*+ FULL(ชื่อตาราง)*/ fieldname, ROWNUM rn FROM tablename WHERE เงื่อนไขและ ROWNUM <= 50 ORDER BY field DESC) t2 โดยที่ t2.rn >= 1;