★jqgrid 페이징 분리

★jqgrid 페이징 분리

참고 = http://blog.naver.com/PostView.nhn?blogId=jaeik714&logNo=140187085974

참고 = http://cofs.tistory.com/31

를 참고하여 페이징 분리를 도전 

*기본적으로 필요한 데이터*

1. 현재 페이지번호 currentPage 

2. 한 페이지에 뿌려질 데이터의 수 rowNum

3. 총 데이터의 갯수 totalRecords

4. 한 화면에 뿌려질 페이지의 수 pageCount 

5.  총 페이지의 수 totalPage 

6. pageCount 가 뿌려질 화면의 수 pageList   (ex) 페이지가 10개씩 뿌려질 화면의 번호

7. pageList의 총 수 totalPageList

pageList    1번

pageList   2번

=====> 총 pageList   갯수는 2개 ==> totalPageList

일단 그리드 페이징에서 각 페이지에따른 값을 보내줌

        userDetaileViewMult(rowid, dcode);
        },
        loadComplete : function() {
            $(".ui-pg-input").css({"color" : "#333","text-align" : "center"});
             //추가할 페이징 영역 - paginate
             //총 레코드 갯수
              var totalRecords = $('#list2').jqGrid('getGridParam','records');
              
               init("list2","paginate",totalRecords,"");
             //init("그리드아이디","페이징아이디",총레코드수,현재페이지);
             //currentPage를 ""로 준 이유는 이전페이지나 마지막 페이지로 이동할때 현재페이지를 받아 계산을 해서
               리로드해야하기 때문..?인듯
              
        }
    });
}
function init(gridId,pageId,totalRecords,currentPage){
    // 변수로 그리드아이디, 총 데이터 수, 현재 페이지를 받는다
    if(currentPage==""){
        var currentPage = $('#'+gridId).getGridParam('page');
    }
    // 한 페이지에 보여줄 페이지 수 (ex:1 2 3 4 5)
    var pageCount = 10;
    // 그리드 데이터 전체의 페이지 수
    var totalPage = Math.ceil(totalRecords/$('#'+gridId).getGridParam('rowNum'));
    
    
    // 전체 페이지 수를 한화면에 보여줄 페이지로 나눈다.
    //var totalPageList = (totalPage/pageCount)*10;
    var totalPageList = Math.ceil(totalPage/pageCount);
    
    
    // 페이지 리스트가 몇번째 리스트인지
    //var pageList=(currentPage/pageCount)*10;
    var pageList=Math.ceil(currentPage/pageCount);
    
    
    
    // 페이지 리스트가 1보다 작으면 1로 초기화
    if(pageList<1){ pageList=1;};
    
    // 페이지 리스트가 총 페이지 리스트보다 커지면 총 페이지 리스트로 설정
    if(pageList>totalPageList){ pageList = totalPageList;}
    // 시작 페이지
    var startPageList=((pageList-1)*pageCount)+1;
    // 끝 페이지
    var endPageList=startPageList+pageCount-1;
    
    
    
    // 시작 페이지와 끝페이지가 1보다 작으면 1로 설정
    // 끝 페이지가 마지막 페이지보다 클 경우 마지막 페이지값으로 설정
    if(startPageList<1){startPageList=1;} 
    if(endPageList>totalPage){endPageList=totalPage;} 
    if(endPageList<1){ endPageList=1;} 
        
                                                                // 기본설정
    
    //paginate 에 들거갈 태그
    var paginateInner="";
    
    
    
    //이전페이지가 비존재 비활성화
    if(pageList<2){
        paginateInner += "<i class='fa fa-angle-double-left'>";
        paginateInner += "<i class='fa  fa-angle-left'>";
    };
    //이전페이지가 존재 활성화
    if(pageList>1){
        paginateInner += "<a href='javascript:firstPage(\""+ gridId +"\", "+(i)+");'><i  class='fa fa-angle-double-left' faPointer></a>";
        paginateInner += "<a href='javascript:prePage(\""+ gridId +"\", "+totalRecords+");'><i  class='fa  fa-angle-left' faPointer></a>";
    };
    
    
    //페이지 숫자를 찍으며 태그생성
    for(var i=startPageList; i<=endPageList; i++){
        if(i==currentPage){
            paginateInner = paginateInner +"<a href='javascript:goPage(\""+ gridId +"\", "+(i)+");' id='"+(i)+"' style='font-weight: 900;'>"+(i)+"</a> ";
        }else{
            paginateInner = paginateInner +"<a href='javascript:goPage(\""+ gridId +"\", "+(i)+");' id='"+(i)+"'>"+(i)+"</a> ";
        };
        
    };
    
    //다음페이지 비존재 비활성화
    if(pageList==totalPageList){
        paginateInner += "<i class='fa fa-angle-right'>";
        paginateInner += "<i class='fa fa-angle-double-right'>";
    };
    
    //다음페이지 존재 활성화
    if(pageList<totalPageList){
        paginateInner += "<a href='javascript:nextPage(\""+ gridId +"\", "+totalRecords+");'><i  class='fa fa-angle-right' faPointer></a>";
        paginateInner += "<a href='javascript:lastPage(\""+ gridId +"\", "+ totalRecords +");'><i  class='fa fa-angle-double-right' faPointer></a>";
    };
    
    $("#paginate").html("");
    $("#paginate").append(paginateInner);
    
    
    
};

//다음 페이지들 생성
function goPage(gridId,num){
     $("#"+gridId).jqGrid('setGridParam', {
          page:num,
         }).trigger("reloadGrid");
      
    }
//리스트 맨 처음으로
function firstPage(gridId){
     $("#"+gridId).jqGrid('setGridParam', {
          page:1,
         }).trigger("reloadGrid");
}
 
//이전페이지로 이동
function prePage(gridId,totalRecords){
    var currentPage = $("#"+gridId).getGridParam('page');
    currentPage = currentPage-1;
    init(gridId,"paginate",totalRecords,currentPage);
     $("#"+gridId).jqGrid('setGridParam', {
          page:currentPage,
         }).trigger("reloadGrid");
}
//다음페이지로 이동 
function nextPage(gridId,totalRecords){
    var currentPage = $("#"+gridId).getGridParam('page');
    currentPage = currentPage+1;
    init(gridId,"paginate",totalRecords,currentPage);
     $("#"+gridId).jqGrid('setGridParam', {
          page:currentPage,
         }).trigger("reloadGrid");
}
//마지막페이지로 이동
function lastPage(gridId,totalRecords){
    var currentPage = $("#"+gridId).getGridParam('page');
    var pageCount=10;
    var totalPage = Math.ceil(totalRecords/$('#'+gridId).getGridParam('rowNum'));
    var totalPageList = (totalPage/pageCount)*10;
    
    init(gridId,"paginate",totalRecords,currentPage);
     $("#"+gridId).jqGrid('setGridParam', {
          page:totalPageList,
         }).trigger("reloadGrid");
}