2025년 4분기 신규기능(Ver 8.3.0.33 ~ )
Ver 8.3.0.33-20251002-16
1. StyleRowConfig에 버튼을 설정할 수 있는 Layout 옵션 추가
StyleRowConfig에 버튼을 설정할 수 있는 Layout 옵션 추가 시트 상단 혹은 하단에 별도의 행을 통해 시트의 스타일을 설정 할 수 있는 StyleRowConfig 속성에 스타일 행의 버튼 순서와 종류를 설정할 수 있는 Layout 옵션이 추가되었습니다.
[사용 예시]
options.Cfg = { StyleRowConfig: { Visible: true, StorageType: 2, ServerUrl: "./ibsheet/styleInfo.jsp", AutoLoad: true, Themes: { Mono: "./assets/ibsheet/css/mono/main.css", // css 파일 내의 클래스를 key와 일치되도록 수정 필요 IBGY: "./assets/ibsheet/css/gray/main.css" }, Layout: ["Init", "Save", "Load", "InitAll"] // 초기화, 저장, 불러오기, 전체 초기화 버튼 추가 } }; |
[예시 소스 실행 결과]
Ver 8.3.0.34-20251016-16
1. Formula의 계산이 발생하기 전 시점의 onBeforeRowFormula 이벤트 추가
Formula의 계산이 발생하기 전 시점의 onBeforeRowFormula 이벤트 추가 각 행에서 Formula가 실행되기 전 호출되는 이벤트인 onBeforeRowFormula 이벤트가 추가되었습니다.
리턴을 통해 Formula의 실행을 제어할 수 있습니다.
> 1(true)리턴 시 각 행에서 실행되는 실행되는 Formula 동작을 막습니다.
**주의 : 해당 이벤트는 Formula 설정이 많을 수록 많이 호출되기 때문에 성능에 문제가 발생할 수 있습니다.
options.Events = { onBeforeRowFormula:function(evtParam){ // 첫번째 행이 아닐 때 Formula를 실행하지 않습니다. var sheet = evtParam.sheet; var datas = sheet.getDataRows(); if (datas.length > 0) { var firstRow = sheet.getFirstRow(); if (evtParam.row != firstRow) { return true; } } } } |
2. Filter행의 Defaults의 최대 너비를 설정할 수 있는 (Cfg) FilterDefaultsMaxWidth 추가
Filter행의 Defaults의 최대 너비를 설정할 수 있는 (Cfg) FilterDefaultsMaxWidth 추가필터 행에서 Defaults 를 사용할 때 생성되는 필터 메뉴의 MaxWidth 를 설정합니다.
생성될 필터 메뉴의 width 가 설정하는 값보다 작은 경우에는 기존의 생성될 width 가 우선되고, 설정하는 값보다 큰 경우에 필터 메뉴의 너비 축소 및 가로 스크롤이 생성됩니다.
options.Cfg = { FilterDefaultsMaxWidth: 500 }; |
3. getSaveJson 사용 시 null값을 ""이 아닌 null로 추출할 수 있는 (Cfg)PreserveNull 옵션 추가
getSaveJson 사용 시 null값을 ""이 아닌 null로 추출할 수 있는 (Cfg)PreserveNull 옵션 추가 사용자가 데이터를 null로 기입한 경우 시트 객체에 null 값 그대로 바인딩하고, getSaveJson으로 데이터 추출시 데이터를 ""이 아닌 null 값 그대로 추출합니다.
options = { Cfg :{ PreserveNull: 1, // 사용자가 데이터를 null로 기입한 경우 getSaveJson으로 데이터를 추출할 때 데이터가 null 값 그대로 추출됨 ... } }; |
Ver 8.3.0.35-20251023-16
1. Group시 정렬 여부를 제어할 수 있는 (Cfg) GroupSort 옵션 추가
Group시 정렬 여부를 제어할 수 있는 (Cfg) GroupSort 옵션 추가 기본적으로 ibsheet8은 Group 시 자동으로 데이터가 정렬이 되도록 동작합니다.
Group 시에 데이터를 자동으로 정렬하지 않도록 설정하는 옵션인 Cfg.GroupSort 옵션이 추가되었습니다.
GroupSort:false 로 설정 시 자동 정렬이 이뤄지지 않습니다.
[사용 예시]
options.Cfg:{ GroupSort:false // 그룹 시 정렬하지 않음 } |
2. (Cfg) UseFilterDialog 설정 시 세부 사항을 설정할 수 있는 옵션 제공
(Cfg) UseFilterDialog 설정 시 세부 사항을 설정할 수 있는 옵션 제공 UseFilterDialog 설정 시 최상단 입력 필터를 숨길지 여부, 높이, ZIndex를 조절할 수 있도록 인자 값으로 object를 설정할 수 있게 추가 되었습니다.
object 설정 시 자동으로 UseFilterDialog 는 기능을 사용한다고 인식합니다.
[options 로 설정할 수 있는 값]
[사용 예시]
UseFilterDialog: { HideInputFilter: true, // 데이터 필터 다이얼로그 내부의 텍스트 필터 다이얼로그 태그를 표시하지 않는 옵션 Height: 150, // 데이터 필터 다이얼로그 오픈 시점의 높이를 조정하는 옵션 ZIndex: 9999, // 데이터 필터 다이얼로그의 ZIndex 값을 조정하는 옵션 }, |
Ver 8.3.0.37-20251030-14
1. 시트의 넓이가 css 클래스에 설정된 height나 width로 설정되는 (Cfg) UseClassStyle 추가
시트의 넓이가 css 클래스에 설정된 height나 width로 설정되는 (Cfg) UseClassStyle 추가 시트에 class 속성이 설정되어 있는 경우, 해당 class에 지정된 CSS에서 height와 width 값을 읽어 시트 생성 시 너비와 높이에 적용하는 UseClassStyle이 추가되었습니다.
너비와 높이가 적용되는 우선순위는 style속성 > class속성 > 기본 값 순으로 적용됩니다.
각 항목에 설정된 값이 없을 경우, 다음 순서로 우선순위가 넘어갑니다.
너비는 100%, 높이는 800px를 기본값으로 갖습니다.
주의 : 이 기능은 단일 Class 정보만을 대상으로 동작합니다.
[사용 예시]
options.Cfg = { UseClassStyle: true, // 시트 div에 style 정보가 없을 경우, class에 선언된 css 클래스들을 확인하여 width와 height를 시트 너비와 높이에 적용 }; |
2. (Method)showFilterDialog에 필터다이얼로그을 설정할 수 있는 opt인자 추가
showFilterDialog에 필터다이얼로그을 설정할 수 있는 opt인자 추가 showFilterDialog에 필터 다이얼로그의 상세 설정을 설정할 수 있는 opt 인자가 추가되었습니다.
지정 가능한 옵션은 상단 input 검색창 표현 여부, 높이, z-index 값이 있습니다.
[사용 예시]
sheet.showFilterDialog({ opt: { HideInputFilter: true, Height: 50, ZIndex: 9999, } }); |
Ver 8.3.0.40-20251113-17
1. UseFilterDialog의 데이터 목록을 표시 방법을 설정하는 Mode 옵션 추가
데이터 필터 목록에 포함될 데이터를 결정합니다.
디폴트는 1이며 2 를 설정할 경우 현재 적용된 필터에 해당하는 데이터를 포함하여 목록을 표시합니다.
UseFilterDialog의 데이터 목록을 표시 방법을 설정하는 Mode 옵션 추가[사용 예시]
//헤더행에 필터 다이얼로그를 띄우는 필터 다이얼로그 아이콘을 생성합니다. options.Cfg = { UseFilterDialog: true }; options.Cfg = { // 필터 다이얼로그를 띄울 때, 어떻게 띄울지 변경합니다. UseFilterDialog: { HideInputFilter: true, // 데이터 필터 다이얼로그를 띄울 때, 다이얼로 최상단의 입력 필터를 띄우지 않습니다. Height: 150, // 데이터 필터 다이얼로그를 띄울 때, 아이템 영역의 높이를 150px로 조정합니다. ZIndex: 1000, // 필터 다이얼로그의 `ZIndex`를 1000으로 설정합니다. Mode: 2 //현재 적용된 필터에 해당하는 데이터를 포함하여 목록을 표시 }, }; |
Ver 8.3.0.42-20251120-16
1. 새로운 행을 추가하지 않고 그룹 행에 소계를 표시하는 (Cfg) UseGroupSubTotal: 2 기능 추가
새로운 행을 추가하지 않고 그룹 행에 소계를 표시하는 (Cfg) UseGroupSubTotal: 2 기능 추가 기존에는 UseGroupSubTotal:1 속성만 제공하여 소계행이 그룹행 이외에 따로 생성되었습니다.
[UseGroupSubTotal:1 사용]
소계행을 따로 만들고 싶지 않고, 그룹행에 함께 표시하고자 할 때 UseGroupSubTotal:2 를 사용할 수 있습니다.
[UseGroupSubTotal:2 사용]
[사용 예시]
options.Cfg = { UseGroupSubTotal:2 // 그룹행에 소계를 함께 표시 }; optons.Col =[ ... {"Header": "추천수","Name": "sRcmn","Type": "Int","Format": "#,###","MinWidth": 140,"Width": 140 ,GroupSubTotal: { Type: "Sum", Format: "#,###", TextColor: "#FFB2F5" } }, ... ]; |
2. 셀 단위로 설정할 수 있는 (Cell) SpinnerVisible, (Cell) SpinnerMax, (Cell) SpinnerMin, (Cell) SpinnerStep 옵션 추가
Type:Int, Float 인 컬럼에 적용 가능한 (Col)Spinner 관련 속성들을 Cell 개별적으로 설정할 수 있도록 속성이 추가되었습니다.
[사용 예시]
var data = [ {"aa":123, "bb":222, "bbSpinnerVisible":1}, ..... ]; |
Ver 8.3.0.43-20251127-14
1. MaxSort 이상 정렬 시, 가장 이전의 정렬이 취소되면서 정렬의 우선 순위는 유지되는 (Cfg) HeaderSortMode: 4 추가
MaxSort 이상 정렬 시, 가장 이전의 정렬이 취소되면서 정렬의 우선 순위는 유지되는 (Cfg) HeaderSortMode: 4 추가 (Cfg)HeaderSortMode: 0(default)은 클릭하여 순서대로 대분류/중분류/소분류가 되며,
MaxSort 이상 정렬 시도 시 정렬 시도를 무시했습니다.
사용의 다양성을 위해 HeaderSortMode:0 과 동일하게 클릭 순서대로 대분류/중분류/소분류가 되지만,
MaxSort 이상 정렬 시도 시 가장 이전의 정렬을 취소시키고 우선순위를 유지하는 옵션인 HeaderSortMode:4 가 추가되었습니다.
[동작 예시]
아래와 같은 상황의 시트에서 "실수" 컬럼을 클릭 시
"콤보" 컬럼의 sort가 취소되고 "실수" 컬럼이 3순위 sort 컬럼이 됨
[사용 예시]
options.Cfg = { HeaderSortMode :4 }; |
Ver 8.3.0.45-20251204-15
1. loadExcel로 엑셀 파일 업로드 시 SEQ 포함 여부를 결정할 수 있는 skipSEQ 인자 추가
해당 인자 사용을 위해 servermodule: 2.0.13, excel: 1.1.31-20251204-15 이상 버전이 필요합니다.
loadExcel 시 mode:NoHeader,HeaderSkip 의 경우 원치 않는 엑셀의 SEQ 컬럼이 업로드 되어 한 칸씩 밀리는 상황이 있습니다.
사용의 다양성을 제공하고자, loadExcel 인자로 엑셀의 SEQ를 포함하여 업로드할 지 여부를 결정할 수 있는 skipSEQ 인자가 추가되었습니다.
[사용 예시]
sheet.loadExcel({ mode:"HeaderSkip", skipSEQ:true // 엑셀의 SEQ 컬럼은 업로드하지 않는다. }) |
2. setRowValue 시 시트 랜더링 여부를 선택 할 수 있는 render 인자 추가, 시트 계산 여부를 선택 할 수 있는 noCalc 인자 추가
setRowValue 시 시트 랜더링 여부를 선택 할 수 있는 render 인자 추가, 시트 계산 여부를 선택 할 수 있는 noCalc 인자 추가 행 단위별 데이터를 설정하는 setRowValue 의 경우 셀 단위 데이터를 설정하는 setValue 와는 다르게 렌더링 여부와 시트 계산 여부를 지정할 수 없었습니다.
데이터 설정 시 동작의 일관성을 유지하기 위해 setRowValue 에 렌더링 여부와 시트 계산 여부를 컨트롤 할 수 있는 render, noCalc 인자가 추가되었습니다.
해당 인자를 false 로 사용 시에는 rerender() 와 calculate() 를 호출하여 수동으로 해당 작업을 해야합니다.
[사용 예시]
var row = sheet.getRowById("AR5"); // ID가 AR5인 행 var data = sheet.getRowValue(row); var targetRow = sheet.getRowById("AR1"); sheet.setRowValue({ row : targetRow, data : data, render : false, // 호출 후 즉시 반영하지 않음 noCalc : false // 호출 후 즉시 포뮬러 계산하지 않음 }); sheet.rerender(); // 시트 렌더링 sheet.calculate(); // 시트 포뮬러 계산 |