1. 시트 생성 시 발생하는 이벤트

ibsheet는 IBSheet.create() 함수를 통해 객체를 생성합니다. 

시트 생성 시 발생하는 이벤트는 다음과 같습니다.


 시트 생성 화면

 

 발생하는 이벤트 순서

순서
이벤트명기능설명
1onRenderStart시트를 렌더링하기 전에 호출되는 이벤트입니다.
2onRenderFinish시트가 렌더링된 후 발생되는 이벤트입니다.
3onRenderFirstFinish시트가 처음 생성되어 렌더링될 때 호출되는 이벤트 입니다. (최초 1회만 발생)
4onRenderPageStart시트의 페이지를 렌더링하기 전 호출되는 이벤트입니다. 시트의 첫 페이지를 로딩하거나 페이지 새로 고침 실행, 페이지 간 이동 시 발생합니다.
5onRenderPageFinish시트의 페이지가 렌더링된 후 호출되는 이벤트입니다. 시트의 첫 페이지를 로딩 시, 페이지에 대한 새로 고침 실행 시, 페이지 간 이동 시 해당 이벤트가 발생합니다. 

 


2. 조회 모드 별 이벤트 발생


시트의 조회 방식은 아래와 같습니다.

유형
함수명기능설명
기본 조회doSearch지정한 URL을 호출하여 리턴된 json을 시트에 로딩합니다.
페이징 조회doSearchPaging페이징 조회(cfg:{SearchMode:3 or 4}) 사용시 지속적으로 호출할 서버 URL을 설정합니다.
데이터 로드loadSearchDatajson 데이터(string 혹은 object)를 시트에 로딩합니다.


시트 내에 데이터 로딩은 SearchMode 설정에 따라 달라집니다.



1) 스크롤 조회 방식(LazyLoad)

SearchMode : 2 인 LazyLoad 방식은 가장 일반적인 방식으로 사용자가 세로 스크롤을 움직일 때마다, 해당하는 데이터를 테이블로 구성하는 모드입니다.
트리나 그룹 등 사용에 제한이 없으며, 각각의 행의 높이가 서로 달라도 사용이 가능합니다.


 시트 조회 화면(SearchMode : 2)


 발생하는 이벤트 순서

순서
이벤트명기능설명
1onReceiveData
데이터 조회 시, 조회 서버 호출 직후 발생하는 이벤트입니다.
2onBeforeDataLoad
시트에 전달된 데이터를 파싱하기 전에 발생합니다. 파싱할 데이터를 조작할 수 있습니다.
3onRowLoad
데이터 로우 객체가 생성된 직후 호출되는 이벤트입니다. 시트의 렌더링이 완료되기 전 시트에 생성되는 각 행마다 호출되며, 해당 이벤트에서 행의 속성 또는 행에 있는 셀의 데이터를 변경할 수 있습니다.
4onDataLoad
데이터 파싱 후 화면에 반영 전에 발생합니다.
5onRenderStart시트를 렌더링하기 전에 호출되는 이벤트입니다.
6onRenderFinish
시트가 렌더링된 후 발생되는 이벤트입니다.
7onSheetFocus시트에 포커스가 되었을 때 호출되는 이벤트입니다.
8onRenderFirstFinish시트 객체가 최초로 생성되어 렌더링될 때 호출되는 이벤트입니다.(최초 1회만 발생)
9onRenderPageStart시트의 페이지를 렌더링하기 전 호출되는 이벤트입니다.
10onBeforeFocus시트 내 셀이 포커스 되기 전에 호출되는 이벤트입니다.
11onFocus시트 내 셀이 포커스 되었을 때 발생하는 이벤트입니다.
12onRenderPageFinish시트의 페이지가 렌더링된 후 호출되는 이벤트입니다.
13onSearchFinish로드된 데이터가 화면에 반영되어 렌더링까지 완료된 상태에서 발생합니다.

 

LazyLoad는 페이지 안에 있는 데이터들이 실제로 화면에 보여질 필요가 있을 때(당장 필요할 때) 해당하는 데이터를 테이블로 구성합니다.


따라서 Page 객체가 존재하며, 데이터 행들을 (cfg)PageLength에서 부여한 갯수 단위로 묶어서 관리합니다.

Page 객체는 자신이 가지고 있는 행들 중 첫번째 행과 마지막행, 그리고 이전과 다음 페이지에 대한 링크를 가지고 있습니다.

페이지 수가 클수록 많은 DOM을 갖게 됨으로 무거워질 수 있습니다. (cfg)MaxPages로 시트가 한 번에 갖고 있는 페이지 수를 설정할 수 있습니다.



2) 대용량 처리 방식(FastLoad)

SearchMode : 0 인 FastLoad 방식은 ibsheet8에서 새롭게 추가된 조회 방식으로 고정된 테이블 객체 안에서 스크롤 시 각 셀의 값만 변경하는 형태로 대량의 데이터를 핸들링하기 우수한 모드입니다.

해당 기능을 사용 시 각 행의 높이는 모두 동일해야 하며, (Appendix)기능에 제약사항이 있습니다.


 시트 조회 화면(SearchMode : 0)


 발생하는 이벤트 순서

순서
이벤트명기능설명
1onReceiveData데이터 조회 시, 조회 서버 호출 직후 발생하는 이벤트입니다.
2onBeforeDataLoad
시트에 전달된 데이터를 파싱하기 전에 발생합니다. 파싱할 데이터를 조작할 수 있습니다.
3onRowLoad
데이터 로우 객체가 생성된 직후 호출되는 이벤트입니다. 시트의 렌더링이 완료되기 전 시트에 생성되는 각 행마다 호출되며, 해당 이벤트에서 행의 속성 또는 행에 있는 셀의 데이터를 변경할 수 있습니다.
4onDataLoad
데이터 파싱 후 화면에 반영 전에 발생합니다.
5onRenderStart시트를 렌더링하기 전에 호출되는 이벤트입니다.
6onRenderFinish
시트가 렌더링된 후 발생되는 이벤트입니다.
7onSheetFocus시트에 포커스가 되었을 때 호출되는 이벤트입니다.
8onBeforeFocus시트 내 셀이 포커스 되기 전에 호출되는 이벤트입니다.
9onFocus시트 내 셀이 포커스 되었을 때 발생하는 이벤트입니다.
10onRenderFirstFinish시트 객체가 최초로 생성되어 렌더링될 때 호출되는 이벤트입니다.(최초 1회만 발생)
11onSearchFinish로드 된 데이터가 화면에 반영되어 렌더링까지 완료된 상태에서 발생합니다.

 

FastLoad는 프레임이 고정되어 있는 상태에서 데이터만 변경됩니다.


따라서 데이터 행의 높이에 동적으로 영향을 주는 타입들은 스크롤 시 문제가 될 수 있어 사용에 제약이 있을 수 있습니다.


AutoRowHeight(Cfg) 속성을 설정하여 행 높이 자동 맞춤 기능 을 사용할 수 있습니다.

단,  컬럼 타입 LinesHtmlImgButton 또는 

컬럼 속성 WrapHtmlPrefixHtmlPostfixTextSizeHtmlPrefixFormulaHtmlPostfixFormulaTextSizeFormula 를 사용한 컬럼이 있을 경우에만 사용이 가능합니다.