페이징 처리 문의

ax5ui

(장진식) #1

페이징 처리시 페이지를 이동하면 정상적으로 됩니다.
그런데 그리드를 칼럼정렬을 한 후 페이지 이동을 하면 해당 페이지 내에서 정렬이 됩니다.
예를 들어 1~100까지 10개씩 10페이지가 있을때
역정렬을 하면 1페이지는 1~10 -> 10~1 로 되며
2페이지는 11~20 -> 20~11 로 됩니다.
정상적이면 1페이지는 100~91, 2페이지는 90~81이 되어야 할것 같은데 재가 제대로 처리하지 못한건인지 아니면 버그인지 모르겠네요.


(위태준) #2

저도 비슷한 고민을 하고 있는데요, 헤더를 클릭했을 때 이벤트를 일으킬 수 있으면 좋을것 같은데

API에는 헤더클릭이벤트나 정렬을 시켰을 때 함수를 호출해주는 기능은 없는것으로 확인되네요

아쉬운데로

$(’#grid-parent td[data-ax5grid-column-key=“insertDt”]’).click(function(e){
alert(‘등록일시’);
});

이런식으로 해당그리드 최상위 div id 값과 그리드의 컬럼key값으로 이벤트를 걸어서 클릭했을 때 정렬된 데이터를 생성하는(DB에서 불러오든 이미 받아온 배열을 다시 정렬하든…) 로직을 적용하고 있습니다.

그런데 한번 이벤트가 발생하면 이벤트걸어 놓은것이 풀리는 현상이 있어서 좀 더 고민중입니다.


(위태준) #3

그리드 생성할 때 setConfig함수의 프로퍼티 중 remoteSort프로퍼티를 사용하면 해결이 가능할것 같습니다.
remoteSort프로퍼티에 함수를 설정하면 헤더를 클릭할 때마다 현재 설정되어있는 정렬정보를 얻을 수 있습니다. 대신에 화면에 보여줄 데이터를 정렬하는 로직은 직접 구현하여야 합니다.

ax5ui.setConfig({
target: $(’[data-ax5grid=“first-grid”]’),
frozenColumnIndex: 2,
frozenRowIndex: 0,
showLineNumber: true,
remoteSort:funtion(setting){
console.dir(setting);
return true;
}
});


(l0pest) #4

아래 소스 참고 하시면 될것 같아요 ^^ 저는 잘됩니다.
remoteSort: function () {//DB 연동 sorting
// alert(“remoteSort: “+Object(this.sortInfo)[i].key+”, remoteSort: “+Object(this.sortInfo)[i].orderBy);
for(i=0;Object(this.sortInfo).length > i ;i++){
console.log(“remoteSort: “+Object(this.sortInfo)[i].key+”, remoteSort: “+Object(this.sortInfo)[i].orderBy);
}
sortInfoObj = this.sortInfo;
if(sortInfoObj != null && sortInfoObj.length != 0){
if(Object(this.sortInfo)[0].key == “bcode” && Object(this.sortInfo)[0].orderBy == “desc”){
$(”#orderBy”).val(“bcodeDESC”).prop(“selected”, true);
}else if(Object(this.sortInfo)[0].key == “bcode” && Object(this.sortInfo)[0].orderBy == “asc”){
$(”#orderBy”).val(“bcodeASC”).prop(“selected”, true);
}else if(Object(this.sortInfo)[0].key == “goodsName” && Object(this.sortInfo)[0].orderBy == “desc”){
$("#orderBy").val(“goodsnameDESC”).prop(“selected”, true);
}else if(Object(this.sortInfo)[0].key == “goodsName” && Object(this.sortInfo)[0].orderBy == “asc”){
$("#orderBy").val(“goodsnameASC”).prop(“selected”, true);
}else{
return;
}

gridView.eventGridSearch();
}