SMART datagrid v1.4 > Examples

Back  Forward

Paging - Row Offset  Example

SMART datagrid 페이징에 대한 페이징 개요기본 예제를 먼저 확인한다. 

각 페이지에 표시할 데이터들이 데이터셋에 모두 존재할 필요는 없다. 특히, 한 페이지에 표시할 정도만을 보관하면서 페이지 위치가 변경될 때마다 데이터를 항상 새로 로드해서 표시하는 방식으로 페이징을 구현할 수 있다. 데이터 로드는 항상 기존 데이터를 모두 제거하고 페이지 시작 위치에 맞춰 데이터행들을 다시 로드한다. 

Code -1
    function loadData(start) {
        // 기존 행들을 모두 제거하고
        dataset.clearRows();
        // 페이지 위치에 맞게 새로 로드한다.
        $.ajax({
            url: "/data/path/dataset.csv",
            success: function (data) {
                DataLudi.loadCsvData(dataset, data, {
                    quoted: true,
                    start: 1 + start,
                    count: 10
                });
            }
        });
    }

그리고, 페이지 위치를 변경할 때 데이터를 다시 로드한다. 

Code -2
    setPage: function (page) {
        var size = grdMain.pageSize();
        // 항상 첫번째 행 부터 가져온다.
        grdMain.setPageAndOffset(page, -page * size);
        loadData(page * size);
    }

혹은, 페이지 위치 이벤트 핸들러에서 데이터를 로드할 수도 있다. 

Code -3
    grid.onPageIndexChanged = function (grid, oldPage, newPage) {
        loadData(grdMain.pageSize() * newPage);
    };

check하면 grid.onPageIndexChanged 에서 데이터 로드. 

check하면 RowIndicator에 ROW_INDEX 대신 DATA_INDEX 표시. 

Grid - 1

소스보기 JSP 

See Also
페이징 개요
GridView.setPaging
GridView.pageIndex
GridView.pageCount
GridView.onPaged
GridView.onPageCountChanged
GridView.onPageIndexChanging
GridView.onPageIndexChanged
Examples
기본 페이징
페이지 데이터 로딩
페이지에 특정 행들 표시