조회 작업을 위해 서버 호출 시 서버에서 리턴되어야 할 "응답 데이터"의 형식을 정의합니다.




시트 생성 시 데이터 형식


IBSheet.create()에 data 속성을 통해 생성 시 데이터 구조

IBSheet.create({
    id:"sheet", // 생성할 시트의 id

    el:"sheetDiv", // 시트를 생성할 Dom 객체 및 id

    options: options, // 생성될 시트의 속성

    // 생성될 시트의 정적데이터
    data: [
            {"sa_name":"홍길동","sa_no":"940154","sa_dept":"A021"},
            {"sa_name":"김지수","sa_no":"950757","sa_dept":"B022"}
        ]
});



doSearch나 loadSearchData 메소드를 통한 데이터 로드


Data 속성 안에 배열형태로 데이터 구성

{"Data":
    [
        {"sa_name":"홍길동","sa_no":"940154","sa_dept":"A021"},
        {"sa_name":"김지수","sa_no":"950757","sa_dept":"B022"}
    ]
}



doSearchPaging 메소드를 통한 데이터 로드


Data 속성 안에 (cfg)PageLength 에서 설정한 개수만큼 배열 형태로 데이터 구성


{"Data":
    [
        {"sa_name":"홍길동","sa_no":"940154","sa_dept":"A021"},
        {"sa_name":"김지수","sa_no":"950757","sa_dept":"B022"}
    ],
 "Total":25410      //<-- DB상의 전체건수 전체 건수
}



조회 후 서버 응답 데이터 규격


Data 속성 안에 배열 형태로 데이터 구성


{"Data":
    [
        {"sa_name":"홍길동","sa_no":"940154","sa_dept":"A021"},
        {"sa_name":"김지수","sa_no":"950757","sa_dept":"B022"}
    ],
  "IO": {"Result": 0, Message: "조회 성공"}
}



조회 데이터 내에 Row property,Cell property 적용(중요)
 

 - 조회 데이터 안에 Row property에 해당하는 내용을 데이터와 함께 적용


{"Data":
    [
        //                                       행의 색상을 붉은색으로 표시
        {"sa_name":"홍길동","sa_no":"940154",...      , Color:"#FF8888"},
        //                                             행 편집 불가
        {"sa_name":"김지수","sa_no":"950757",...      , CanEdit:0}
    ]
}



 - 조회 데이터 안에 "컬럼명+Cell Property" 형식으로 설정시 Cell 기능 부여


{"Data":
    [
        //                                     sn_id cell 글자색 설정
        {"sn_id":"209321","lot":"k0923123",  sn_idTextColor:"#FF0000"},
        //                                     lot cell 편집 불가
        {"sn_id":"209327","lot":"r2019283",   lotCanEdit:0},
        //  pos 컬럼(Enum타입)에 item을 해당 셀만 다르게 설정
        {"pos":"A02", posEnum: "|성남시|부천시|광명시|화성시", posEnumKeys: "|A00|A01|A02|A03"}
    ]
}


조회 데이터 내에 JSON Event 적용


// 조회 데이터에 JSON 이벤트를 포함할수 있습니다.
{"Data":
    [
        //           sa_name컬럼의 값 수정시 sawonPop() 함수 호출
        {"sa_name":"홍길동",sa_nameOnChange:"sawonPop"},
    ],
}



조회 작업 시 서버에서 리턴 된 데이터는 onReceiveData, onDataLoad 이벤트를 통해 확인하실 수 있습니다.






Tree 데이터 로드


1) 일반적인 Tree 데이터 형태



// Items 속성안에 자식 행을 추가하는 형태로 구성
{"Data":
    [
        //1 Depth
        {sProduct:"내부 시스템 개발 사업",sCustomer:"B사",sDate:"20180116", sCustomerRowSpan:2,
            //2 Depth
            Items:[
                {sProduct:"글로벌 통합 인사시스템",sKind:"프로젝트", sCount:"1",sPrice:"192"},
                {sProduct:"LEGACY SW 공급",sKind:"소프트웨어", sCount:"1",sPrice:"420"}
            ]
        },
        //1 Depth
        {sProduct:"복무급여고도화시스템",sCustomer:"D사",sDate:"20171031",
            //2 Depth
            Items:[
                {sProduct:"병원 전자구매 및 조달시스템",sKind:"납품",sCount:"1",sPrice:"303",sDiscount:"10" }
            ]
        },
        //1 Depth
        {sProduct:"2017~2018 솔루션 납품 및 판매",sCustomer:"E사",sDate:"20170520",
            //2 Depth
            Items:[
                {sProduct:"병원 개발/CDP 구축",sKind:"프로젝트",sCount:"1",sPrice:"29"},
                {sProduct:"성능개량 군수지원교보재",sKind:"프로젝트",sCount:"1",sPrice:"15.5",sDiscount:"5"},
                {sProduct:"SHE시스템 구축",sKind:"프로젝트",sCount:"1",sPrice:"79"},
                {sProduct:"Cost Quotation System",sKind:"프로젝트",sCount:"1",sPrice:"3"},
                {sProduct:"전사업무지원시스템",sKind:"프로젝트",sCount:"1",sPrice:"59.5"},
                {sProduct:"통합판매관리시스템",sKind:"프로젝트",sCount:"1",sPrice:"39"},
                {sProduct:"E-HR시스템",sKind:"유지보수",
                    //3 Depth
                    Items:[
                        {sProduct:"물산 E-HR시스템",sKind:"기타",sCount:"1",sPrice:"4"},
                        {sProduct:"제조 E-HR시스템",sKind:"기타",sCount:"1",sPrice:"4" }
                    ]
                },
                {sProduct:"건설 외주실적 단가시스템",sKind:"납품",sCount:"1",sPrice:"95"},
                {sProduct:"인재육성시스템",sKind:"프로젝트",sCount:"1",sPrice:"7"},
                {sProduct:"웹사이트 액티브X제거 관련 SW 구매",sKind:"프로젝트", sCount:"1",sPrice:"22.5" }
        ]}
    ]
}



2) 간단한 Tree 데이터 형태


var treeData = {
    "Data":[
        {Level:1 ,sProduct:"병원 개발/CDP 구축",sKind:"프로젝트",sCount:"1",sPrice:"29"},
        {Level:2 ,sProduct:"성능개량 군수지원교보재",sKind:"프로젝트",sCount:"1",sPrice:"15.5",sDiscount:"5"},
        {Level:3 ,sProduct:"SHE시스템 구축",sKind:"프로젝트",sCount:"1",sPrice:"79"},
        {Level:2 ,sProduct:"Cost Quotation System",sKind:"프로젝트",sCount:"1",sPrice:"3"},
        {Level:3 ,sProduct:"전사업무지원시스템",sKind:"프로젝트",sCount:"1",sPrice:"59.5"},
        {Level:3 ,sProduct:"통합판매관리시스템",sKind:"프로젝트",sCount:"1",sPrice:"39"},
    ]
}


위와 같이 Level을 통해 각 행의 Depth를 가져온 후 데이터 로드 시점에서 ibsheet-common.js에서 제공하는 convert함수를 통해 변환하여 로드한다. (Level의 대소문자 주의)


var convertData = IBSheet.v7.convertTreeData(treeData);
sheet.loadSearchData(convertData));