IBSheet8 Manual Sample

author(s): IBSheet

HTML

<!-- ibsheet css -->
<link rel="stylesheet" href="https://www.ibsheet.com/v8/assets/lib/ibsheet/css/default/main.css"/>
<!--  ibsheet 필수 js -->
<script src="https://www.ibsheet.com/v8/assets/lib/iblicense.js"></script>
<script src="https://www.ibsheet.com/v8/assets/lib/ibsheet/ibsheet.js"></script>
<script src="https://www.ibsheet.com/v8/assets/lib/ibsheet/locale/ko.js"></script>

<!--  ibsheet 선택/추가 js -->
<script src="https://www.ibsheet.com/v8/assets/lib/ibsheet/plugins/ibsheet-common.js"></script>
<script src="https://www.ibsheet.com/v8/assets/lib/ibsheet/plugins/ibsheet-dialog.js"></script>
<script src="https://www.ibsheet.com/v8/assets/lib/ibsheet/plugins/ibsheet-excel.js"></script>
<script src="https://www.ibsheet.com/v8/assets/lib/ibsheet/plugins/jszip.min.js"></script>
<div>
1. <b>정수(올림)</b> 컬럼은 <b>Cfg</b> 설정값에 의하여 소수점 첫째 자리에서 올림 처리됩니다.<br/>
2. <b>실수(내림)</b> 컬럼은 <b>Col</b> 설정값에 의하여 소수점 셋째 자리에서 내림 처리됩니다.<br/>
3. <b>실수(반올림)</b> 컬럼은 <b>Col</b> 설정값에 의하여 소수점 셋째 자리에서 반올림 처리됩니다.<br/>
4. <b>실수(반올림)</b> 컬럼의 3행 데이터는 <b>Cell</b> 설정값에 의하여 소수점 셋째 자리에서 내림 처리됩니다.<br/><br/>
</div>
<div style='height:500px'><div id='sheetDiv' style='width:100%;height:100%'></div></div>

CSS

a{text-decoration:none;color:#4444FF;}

JavaScript

var ib = ib||{};
ib = {
//시트 초기화 구문
'init':{
  //공통기능 설정 부분
  "Cfg": {
    "SearchMode": 2,
    "HeaderMerge": 3,
    "MessageWidth": 300,
    "IgnoreFocused": 1,
    "DecimalAdjust" : "ceil" // 전역 기본값
  },
  "Def": {
    "Row": {
      "CanFormula": true
    }
  },
  //틀고정 좌측 컬럼 설정
  "LeftCols": [
    {"Type": "Int","Width": 50,"Align": "Center","Name": "SEQ"}
  ],
  //중앙(메인) 컬럼 설정
  "Cols": [
    {Header: "원본", Type: "Float", Name: "sData", Width: 100}, //기본 소숫점 6자리까지 표시
    {Header: "정수(올림)", Type: "Int", Name: "sInt", Width: 100 }, // Cfg(ceil) 적용
    {Header: "실수(내림)", Type: "Float", Name: "nFloat_floor", Width: 100, Format: "#,##0.###",DecimalAdjust: "floor" }, // Col이 Cfg를 덮어씀
    {Header: "실수(반올림)", Type: "Float", Name: "nFloat_ceil", Width: 100, Format: "#,##0.###",DecimalAdjust: "round" } // Col이 Cfg를 덮어씀
    
  ]
},
//시트 이벤트
'event':{
    onRenderFirstFinish: function(evt) {
    	evt.sheet.loadSearchData(ib.data);
    }
},
//시트객체 생성
'create':function () {
    var options = this.init;

    options.Events = this.event;
    IBSheet.create({
      id: 'sheet', // 생성할 시트의 id
      el: 'sheetDiv', // 시트를 생성할 Dom 객체 및 id
      options: options, // 생성될 시트의 속성
    });
},
//조회 데이터
'data':[
  {"sData":"6290.9381","nFloat_floor":"6290.9381","sInt":"6290.9381","nFloat_ceil":"6290.9381"},
  {"sData":"9345.0219","nFloat_floor":"9345.0219","sInt":"9345.0219","nFloat_ceil":"9345.0219"},
  {"sData":"45.0295","nFloat_floor":"45.0295","sInt":"45.0295","nFloat_ceil":"45.0295","nFloat_ceilDecimalAdjust":"floor"}
  ]
}
ib.create();