2025년 1분기 신규기능(Ver 8.2.0.15 ~ Ver 8.2.0.)
Ver 8.2.0.15-20250102-15
1. (Cfg) ValidCheck로 나오는 경고 메시지 이후 동작을 제어할 수 있는 Edit, Focus 옵션 추가
(Cfg) ValidCheck로 나오는 경고 메시지 이후 동작을 제어할 수 있는 Edit, Focus 옵션 추가 기존에 ValidCheck: true 로 설정 시 경고 메시지 출력 이후 무조건 해당 셀에 Focus 가 가고, Edit 상태가 됩니다.
해당 속성을 boolean 이 아닌, Json 형태로 설정하면 경고 메세지 출력 이후 Focus 와 Edit 을 커스텀하여 설정 할 수 있게 되었습니다.
[사용 예시]
Cfg.ValidCheck: { Focus : 1, // 경고 메세지 출력 이후 해당 셀에 Focus 를 주기 // 경고 메세지 출력 이후 해당 셀은 Edit 상태로 들어가지 않기} |
2. makePivotTable에 평균 계산 기능 추가
Ver 8.2.0.15-20250102-15 에 맞는 locale 파일이 필요합니다.
기존에는 피벗 테이블을 만들 때 Sum, Count, Max, Min 으로만 컬럼을 계산 할 수 있었습니다.
여기에 추가해 Type: "Avg" 를 추가하여 평균값을 계산할 수 있도록 수정하였습니다.
Ver 8.2.0.16-20250109-13
1. importData로 'xls'파일을 선택 시 서버모듈 호출 여부를 설정하는 (Cfg) XlsImportMode 추가
importData로 'xls'파일을 선택 시 서버모듈 호출 여부를 설정하는 (Cfg) XlsImportMode 추가 ibsheet-excel.js 1.1.9-20250109-13 이상 버전이 필요합니다.
클라이언트 모듈인 importData 로 xls 파일을 업로드 시도하면
"xls 파일 형식은 지원하지 않습니다." 라는 경고창이 출력되며 업로드가 불가능했습니다.
(Cfg)XlsImportMode:1 로 사용하면 importData 로 xls 파일을 선택했을 때 서버모듈로 동작하여 xls 파일을 업로드 할 수 있도록 동작합니다.
[사용 예시]
| Cfg : { // importData 를 이용하여 xls 파일 업로드 시 서버모듈을 이용 XlsImportMode:1 } |
2. DataFormat에 타임존을 포함하는 yyyyMMddTHHmmssz 추가
DataFormat에 타임존을 포함하는 yyyyMMddTHHmmssz 추가 기존에는 DataFormat 에 타임존 포함 형식을 지정하면 인식하지 못하고 NaN으로 값이 표시되었습니다.
DataFormat: yyyyMMddTHHmmssz 의 타임존 포함 형식이 지원됩니다.
Ver 8.2.0.18-20250123-14
1. 특정 아이디의 시트가 존재하는 지 확인하는 IBSheet.hasSheet API 추가
특정 아이디의 시트가 존재하는 지 확인하는 IBSheet.hasSheet API 추가기존에는 특정 아이디의 시트가 존재하는지 판단하기 위해 window 객체에 직접 접근하여 시트 ID를 탐색했습니다.
특정 아이디의 시트가 존재하는 지 확인하는 로직은 꽤 많이 이용되는 로직이기 때문에(특히 SPA 사용자)
시트단에서 저리를 하는 방식으로 hasSheet API 가 추가되었습니다.
IBSheet.hasSheet("찾고자하는ID") 방식으로 호출하시면 해당 ID시트 존재 여부에 따라 true/false 를 리턴합니다.
[사용 예시]
| IBSheet.hasSheet("sheet") // sheet 라는 id의 시트가 존재하면 true, 없으면 false return |
Ver 8.2.0.19-20250206-14
1. doSave, getSaveJson, getSaveString시 유효성 검사를 할 수 있는 onValidation 이벤트 추가
doSave, getSaveJson, getSaveString시 유효성 검사를 할 수 있는 onValidation 이벤트 추가 doSave, getSaveJson, getSaveString 등 저장 api 호출시, 사용자가 저장할 값들에 관해 유효성 검사를 진행할 수 있도록 셀 별로 순회하며 발생하는 이벤트 입니다.
기본적인 필수입력 항목에 대한 확인이나 전체 입력 여부에 대한 확인은 저장 전에 시트가 내부적으로 확인하지만, 업무 로직에 따라 발생할 수 있는 각종 유효성 검사를 이 이벤트에서 처리합니다.
[사용 예시]
options.Events = { onValidation: function (evtParam) { if (evtParam.col != "TextData") return false; var prevCol = evtParam.sheet.getPrevCol(evtParam.col); // TextData 컬럼의 이전 컬럼 값이 100보다 큰 경우 메세지창을 띄우고 저장을 중단합니다. if (evtParam.sheet.getValue(evtParam.row, prevCol) >= 100) { var index = evtParam.sheet.getRowIndex(evtParam.row);
evtParam.sheet.showMessageTime({ message: index + "행 정수(Int)컬럼 셀 값이 100보다 큽니다.", time: 10000, buttons: ["OK", "취소"], }) return true; } } } |
2. onBeforeSave 이벤트에 source.params(소문자) 추가
이벤트 내부 인자의 통일성을 위해 기존 Params에서 params 로 첫글자가 소문자로 변경되었습니다.
3. (Method)setValue 호출 시 이벤트 발생 여부를 제어할 수 있는 ignoreEvent 인자 추가
setValue 호출 시 ignoreEvent 설정을 통해 제어할 수 있는 각 이벤트의 사용방법은 아래와 같습니다.
인자로 Json 형태로 옵션 세팅이 가능하며, 이벤트 이름을 key 값으로 넣고, true 리턴 시 지정한 이벤트가 발생하지 않습니다.
[사용 예시]
| var setRow = sheet.getRowById("AR5") sheet.setValue({ row: setRow, col: "sName", val: "홍길동", ignoreEvent : { OnChange: true, // setValue 시 OnChange 발생x OnSame: true // setValue 시 OnSame 발생x } }) |
Ver 8.2.0.21-20250220-14
1. (Method)setValue 의 인자 ignoreOnEndEdit 를 ignoreEvent 로 통합
ibsheet Ver 8.2.0.19-20250206-14 에서 이벤트 발생 여부를 제어할 수 있는 ignoreEvent 인자가 추가 된 이후,
사용자의 편의성을 위해 onEndEdit 이벤트를 제어할 수 있는 ignoreOnEndEdit 인자를 추가된 ignoreEvent 로 통합했습니다.
[사용 예시]
| var setRow = sheet.getRowById("AR5") sheet.setValue({ row: setRow, col: "sName", val: "홍길동", ignoreEvent : { onEndEdit: true, // setValue 시 onEndEdit 발생X } }) |
2. 시트 생성 시 Visible:0 으로 설정된 컬럼이 DOM에 생성되지 않는 (Cfg)NoRenderHidden 추가
시트 생성후 최초 조회할 때 보이지 않는 컬럼은 Dom에 생성하지 않도록 합니다.
해당 기능을 1으로 사용하면 보이지 않는 컬럼 (Visible: 0) 은 화면에 랜더링되지 않아 많은 컬럼이 있는 경우 보다 빠르게 랜더링 될 수 있습니다.
[사용 예시]
| options = { Cfg : { NoRenderHidden :1 //보이지 않는 컬럼을 Dom에다 미리 생성하지 않도록 설정 } }; |
Ver 8.2.0.23-20250306-19
1. Required 이미지 경로를 설정할 수 있는 (Cfg)RequiredImage 추가
기존에 별표로 표시되었던 Required의 이미지를 변경하려면 main.css 에서 수정해야 했습니다.
사용자가 손쉽게 Required 이미지를 변경할 수 있도록 (Cfg)RequiredImage 가 추가되었습니다.
[사용 예시]
| Cfg : { ... RequiredImage : "원하는이미지경로" ... } |
2. 피벗 필터 기능을 피벗 다이얼로그에서 적용할 수 있도록 추가
ibsheet-dialog.js 1.0.32-20250306-19 이상 버전이 필요합니다.
피벗 필터 기능은 ibsheet.js 8.2.0.1 에서 (Method)doPivotFilter 로 추가되었습니다.
이에 맞춰 피벗 다이얼로그에서도 편하게 피벗필터 기능을 사용할 수 있도록 추가되었습니다.
추가된 피벗 필터 기능에 맞춰 피벗 다이얼로그 UI에 변경이 있습니다.
[변경된 피벗 다이얼로그]
Ver 8.2.0.25-20250320-15
1. (Method)exportData 로 엑셀 파일을 틀고정해서 내보낼 수 있는 freezePane 인자 추가
해당 인자는 비트 연산으로, 선택할 수 있는 옵션은 아래와 같습니다.
[사용 예시]
| sheet.exportData({ freezePane: 5 // 헤드 영역 틀고정, 왼쪽 고정 열 틀 고정 적용 }) |
Ver 8.2.0.26-20250327-15
1. exportData의 인자들을 설정할 수 있는 (cfg) ExportDataConfig 옵션 추가
(Cfg)Down2ExcelConfig 와 동일하게,
exportData 함수 호출시 들어가는 인자를 공통으로 설정합니다.
CommonOptions(static)에 Cfg속성에 설정하시면 모든 화면에서 exportData 함수 호출시 기본적인 속성을 설정하실 수 있습니다.
[사용 예시]
| options.Cfg = { // 모든 화면에서 exportData 로 엑셀 다운로드시 기본 속성을 설정 ExportDataConfig: { "sheetDesign":0, "merge":1 } }; |
2. 시트를 태블릿 모드로 생성할 수 있는 (cfg) TabletMode 옵션 추가
(cfg) TabletMode 옵션 추가 태블릿 PC 와 같은 기기 사용 시 기존은 무조건 모바일 모드로 동작했습니다.
TabletMode:1(true) 를 설정하면 태블릿 PC에서 시트가 모바일 모드가 아니라 태블릿 모드로 동작합니다.
3. 마우스 드래그 또는 shift+클릭으로 Type: "Bool" 컬럼만 선택할 경우 선택 셀의 체크를 변경하는 (col) SelectCheck 추가
(col) SelectCheck 추가 체크박스를 여러 개 변경할 때 사용성이 간편하도록(Col)SelectCheck 인자가 추가되었습니다.
해당 인자를 1로 설정 시, 다중 선택(마우스 드래그, shift+클릭) 시 체크박스의 값이 반전 됩니다.
[사용 예시]
| Cols : [ { Header: { Value: "체크박스(Bool)", HeaderCheck: 1 }, Type: "Bool", Name: "CheckData", CanEdit: 1, SelectCheck: 1, // 다중 선택 시 체크박스의 값이 변경되도록 설정 }, ...] |
4. 조회된 데이터에 Enum에 설정한 값이 없을 때, Enum, EnumKeys에 해당 값이 추가되는 (col) EnumStrictMode: 2 옵션 추가
Enum에 설정한 값이 없을 때, Enum, EnumKeys에 해당 값이 추가되는 (col) EnumStrictMode: 2 옵션 추가 기존에 있었던 (Col)EnumStrictMode: 1 은 Enum 에 없는 값이 들어올 때 단순히 셀에 해당 값을 표시하는 속성입니다.
이번 릴리즈에서 2 옵션을 추가하여 Enum에 없는 값이 들어올 때 셀에 표시할 뿐 아니라 Enum, EnumKeys 에 자동으로 해당 값이 추가됩니다.
5. 조회된 데이터에 Enum에 설정한 값이 없을 때, Enum의 드롭다운 메뉴에 대체 텍스트를 표시할 수 있는 (col) EnumNoMatchText 옵션 추가
Enum에 설정한 값이 없을 때, Enum의 드롭다운 메뉴에 대체 텍스트를 표시할 수 있는 (col) EnumNoMatchText 옵션 추가 (Col)EnumNoMatchText:1 로 설정 시 Enum 에 설정한 값이 없을 때 Enum 셀에 들어온 값이 아닌 대체 텍스트를 표시할 수 있습니다.
Enum 에 설정한 값이 셀에 출력되어야 함으로 (Col)EnumStrictMode:1 과 함께 사용하셔야 합니다.