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(val)
{
var n페이지 = 0;

if (val == 1) {
CurTab++;
nPage = (CurTab - 1) * PageTab + 1;
}
else if (val == -1) {
CurTab--;
nPage = (CurTab - 1) * PageTab + 1;
}
else if (val == 0) {
CurTab = 1;
n페이지 = 1;
}
else if (val == -2) {
CurTab = Math.floor(TotalPage / PageTab) + 1;
nPage = (CurTab - 1) * PageTab + 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;";

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

if (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개부터 51개까지의 레코드를 쿼리하는 등 표시할 페이지 수를 기준으로 쿼리 범위를 생성합니다. 100, 101부터 150까지의 기록입니다. . .
cscCustomAnalyst는 비동기 호출 함수이며, 함수 구현을 위한 코드는 아래에 게시하겠습니다. "Method", "SID", "TIME1", "TIME2", "ROW1", "ROW2"는 모두 쿼리를 실행하는 데 필요한 매개 변수입니다. Method는 실행할 쿼리를 결정하는 데 사용되며, "ROW1", "ROW2"는 의미합니다. 쿼리할 레코드 범위와 기타 매개변수는 실제 필요에 따라 조정될 수 있습니다. ShowCarTrack(val)은 쿼리 결과를 처리하는 함수로, 비동기 호출이 완료된 후 얻은 결과를 이 함수에서 분석, 처리, 표시합니다. 코드의 이 부분은 특정 구현에 따라 작성되었으므로 여기에 나열하지 않겠습니다.

함수 TurnPage(val)
{
if (Number(val) != CurPage) {

CurPage = 숫자(값);

var row1 = String((CurPage - 1) * 50 + 1);
var row2 = String(CurPage * 50);

var trackinfo = document.getElementById("div_trackpoint");
trackinfo.innerHTML = "데이터를 가져오는 중입니다. 잠시 기다려 주십시오...";

_cscCustomAnalyst(["메소드", "SID", "TIME1", "TIME2", "ROW1", "ROW2"],
["GetCarTrack",, "80100117", t1, t2, row1, row2],
ShowCarTrack,onQueryError);

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

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

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

statusinfo.innerHTML = "페이지" + CurPage + "페이지";
}

}

NextPage는 다음 페이지로 전환하고 TurnPage를 호출하여 이를 구현합니다. 다음 페이지가 현재 그룹을 초과하면 다음 그룹으로 전환해야 합니다.

함수다음페이지()
{
if (CurPage < TotalPage) {

TurnPage(CurPage+1);

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

}

PreviousPage는 이전 페이지로 전환하고 TurnPage를 호출하여 이를 구현합니다. 이전 페이지가 현재 그룹을 초과하는 경우 이전 그룹으로 전환해야 합니다.
함수 이전페이지()
{
if (CurPage > 1) {

TurnPage(CurPage-1);

if ((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("Content-Type", "application/x-www-form-urlencoded");

xhr.onreadystatechange=함수(){

var ReadyState=xhr.readyState;

if (readyState==4){

var 상태=xhr.status;

if(상태==200){

var 결과 집합 = xhr.responseText;

if(결과 집합 == null){
onComplete(널);
반품;
}

if(onComplete){
onComplete(결과세트);
결과 집합 = null;
}
}
또 다른{
if(onError){
onError(xhr.responseText);
}
}

xhr.onreadystatechange = function(){};

xhr = null;
}
};

var paramString=null;

if(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(테이블 이름)*/ 필드 이름, ROWNUM rn FROM 테이블 이름 WHERE 조건 AND ROWNUM <= 50 ORDER BY 필드 DESC) t2 where t2.rn >= 1;