thomasJang / axisj

javascript UI library
http://axisj.com/
GNU Lesser General Public License v2.1
310 stars 86 forks source link

페이징 영역에서 디자인 깨짐 문제... #995

Open channy83 opened 7 years ago

channy83 commented 7 years ago

.setData() 를 이용하여 리스트와 페이징 처리를 하고 있고 검색/조회 등의 버튼을 누르기 전에는 리스트를 넣지 않은 빈 그리드를 보여주려 하고 있습니다. 그래서 .setConfig 에서 다음과 같이 초기 값을 넣었습니다.


grid.setConfig({
    // 기타 설정 ~~~~
    , page : {
        paging  : true, // {Boolean} -- 페이징 사용여부를 설정합니다.
        pageNo  : 0,    // {Number} -- 현재 페이지 번호를 설정합니다.
        pageCount : 0,  // 총 페이지 수
    }
)};

그 결과가 아래의 화면입니다. 페이지 셀렉트 박스 부분이 너무 좁아요.

axgrid_page0

위의 setConfig에서 page 옵션에 paging: true 만 설정하고


$(document).ready(function({
    var gridData = {
        list: []
        , page:{
            pageNo: 0,
            pageCount: 0,
            listCount:0
        }
    };
    grid.setData(gridData);
});
이런 식으로도 해봤지만 별 차이가 없네요. setList는

var gridData = {
    list: list
    , page:{
    pageNo: pageNo,
     pageSize: pageSize,
     pageCount: Math.ceil(listCount/pageSize),
     listCount: list.length,
     onchange: function(pageNo){
        search(pageNo);
    }
    }
};
grid.setData(gridData);
이런 식으로 하고 있는데 데이터를 넣어줘도 페이징 영역의 크기는 변화가 없어서 페이지 셀렉트 박스를 클릭하면 페이지 목록 숫자가 제대로 안 보입니다. ![axgrid_page1](https://cloud.githubusercontent.com/assets/5335528/24493532/1569e574-156a-11e7-8efd-eaf75f3eb4e9.png) axgrid 의 targetID가 되는 엘리먼트에 width는 따로 주지 않았고 개발자 도구로 해당 엘리먼트들과 그 하위에 다른 css가 덧씌워졌나 확인해봤지만 그런건 없는 걸로 보였습니다. 원인이나 해결방법이 없을까요?