Grid에서 페이징을 하면 화면이 새로고침 됩니다.

var pga010searchGrid = {
        initView: function () {
            this.target = new ax5.ui.grid();
            this.target.setConfig({
                target: $('[data-ax5grid="pga010_search_Grid"]'), 
                page: {
                    navigationItemCount: 2,
                    height: 30,
                    display: true,
                    firstIcon: '<i class="fa fa-step-backward" aria-hidden="true"></i>',
                    prevIcon: '<i class="fa fa-caret-left" aria-hidden="true"></i>',
                    nextIcon: '<i class="fa fa-caret-right" aria-hidden="true"></i>',
                    lastIcon: '<i class="fa fa-step-forward" aria-hidden="true"></i>',
                    onChange: function () {
                        searchPagingBtn(this.page.selectPage);
                    }
                },
                columns: [
                    {key: "rn", label: "No", align: "center", width: "*"},      
                    {key: "kindNm", label: "종류", align: "center", width: "*"},
                    {key: "name", label: "명칭", width: "*"}
                ],              
            });
            return this;
        },
        setData: function (_pageNo, searchList, listNo) {
            var totalPage = parseInt(listNo/10);
            if((listNo/5)-totalPage > 0)
                totalPage += 1;

            this.target.setData({
                list: searchList,
                page: {
                    currentPage: _pageNo || 0,
                    pageSize: totalPage,
                    totalElements: listNo,
                    totalPages: totalPage
                }
            });
            return this;
        },
        align: function () {
            this.target.align();
        }
};

function searchPagingBtn(pageNum){      
    if(pageNum == null){
        pageNum = 0;
    }
    $("#pageNum").val(pageNum); //페이징 번호 지정

    var formData = $('form[name=parkSearchForm]').serialize();

    $.ajax({
        method: "GET",
        url: "./pga010parkListSearch.do",
        data: formData,
        //data: {"pageNum":pageNum},
        dataType:"json",
        success: function (res) {         
            pga010searchGrid.setData(pageNum, res.pga010searchList, res.pga010ListCnt);

        }
    });        
}

onChange에서 함수를 타서 Grid에 뿌려줄 리스트와 리스트의 총 Count 그리고 페이지 번호를 넘깁니다.

setData까지는 진행되어 리스트 결과값이 Grid에 잠시 그려지는데 바로 화면이 새로고침되어 처음으로 돌아가버립니다.

backward, left, right, forward 버튼 전부 다 누를시 같은현상인데

reload함수를 쓴것도 아니고 되돌아가는 페이지 url을 호출한것도 아닌데 왜 이러는 걸까요?

그리고 Grid 아래에 0 - 0 of 0 으로 표시되는 data-ax5grid-page="status" 부분을 화면에서 표시하지 않도록 제어할수 있는 속성이 있나요?

ax5ui / ax5ui-grid

Grid에서 페이징을 하면 화면이 새로고침 됩니다. #30