AG Grid Interface / API 정리

• Grid Interface와 Column Interface가 존재함.

Grid Interface

• Grid Option, Grid API, Grid Events, Row Node 의 조합이다.

• Option은 grid configure를 담당하는 속성값들, api는 grid가 생성되고 상호작용하는 메서드들, event는 grid에 의해 발생되는 이벤트들을 말한다.

• Row Node : Grid의 row들은 Row Node Object로 나타내지고, 각각의 속성들을 갖는다.

Column Interface

• grid column들과 interact할 수 있는 interface임

• Column Properites, API, Colum Object로 구성됨

GridApi

• getFocusedCell : Focus된 Cell을 반환

• getModel : table의 rowModel을 반환함.

Grid의 Row Models이란

• 데이터를 어떻게 저장하고 렌더링하는지를 결정함, 4가지의 Row Model이 존재함

Client-Side Row Model (CSRM):

• 클라이언트 측에서 데이터를 모두 로드하고 처리합니다.
  그리드에 표시할 데이터가 작을 때나 클라이언트 측에서 모든 데이터를 캐싱할 수 있는 경우 유용합니다.
  모든 데이터가 클라이언트에 의해 로드되므로 서버와의 추가 통신이 필요하지 않습니다.

Infinite Row Model (IRM):

• 그리드는 페이지 단위로 데이터를 동적으로 로드하고, 스크롤 시 필요한 데이터만 서버에서 요청합니다.
  서버 측 페이징 및 무한 스크롤을 지원하며 대용량 데이터에 적합합니다.

Server-Side Row Model (SSRM):

• 클라이언트는 필요한 데이터를 서버에 요청하고 서버는 해당 데이터를 제공합니다.
  대규모 데이터베이스와 연동하여 데이터를 효과적으로 관리하는 데 사용됩니다.

Viewport

• applyTransaction : Client Side 업데이트 : transaction object를 row Data에게 전달함. => add,remove, update가 존재함.

GridOptions

• animateRows : Row Animation가능하게 하는 boolean 속성임

• cacheQuickFilter : rowData에 대한 검색을 가능하게 해주는 속성, cache를 이용함

• getContextMenu(enterprise) : 사용자가 오른쪽 마우스를 클릭했을때 contexnt menu를 보여주는 속성.

• context menu에 대한 추가 custom 가능함.

• getRowId(enterpise) : 각각의 row에 대한 unique key값을 줌.(그래야 row의 위치가 바뀌어도 선택된 상태가 유지됨)

• groupAggFiltering(enterpise) : 그룹회된 열 데이터에 대한 특정 집계함수를 정의하고 필터링 조건 설정 가능함.

• processDataFromClipboard : 클립보드로부터 데이터를 그리드에 붙여넣을 때 데이터를 어떻게 처리할지를 제어하기 위한 옵션임. => 데이터 변환 및 가공, 유효성검사, 데이터할당 등등 가능

gridOptions: {
  // 다른 그리드 옵션들...

  processDataFromClipboard: function (params) {
    // 클립보드 데이터를 처리하는 사용자 지정 로직을 작성
    // params 파라미터를 사용하여 클립보드 데이터 및 그리드 정보에 접근

    // 예: 클립보드 데이터를 파싱하고 특정 셀에 할당
    const clipboardData = params.data;
    const rowIndex = params.range.startRow.rowIndex;
    const colId = params.range.columns[0].colId;
    const cellToAssign = clipboardData[0]; // 예시로 첫 번째 데이터 할당

    // 클립보드 데이터를 특정 셀에 할당
    params.api.setValue(cellToAssign, rowIndex, colId);
  },
}

• readOnlyEdit : 데이터 수정시 수정사항이 그리드에 반영되지 않음.

• suppressAggFuncInHeader : 집계함수가 표시되는지 여부를 나타냄
  true이면 집계함수가 열 헤더에 표시되지 않도록 함.

• suppressRowDrag : RowDrag하는 아이콘을 없애는 기능. true라면 Drag Icon을 표시하지 않음.(Drag기능 사용 X)

GridEvents

• onCellEditRequest : Read Only Edit 가 true라면, 데이터를 수정했을때 그리드의 데이터가 수정되는 것이 아니라 onCellEditRequest라는 event가 fire됨.

• onGridReady : 그리드가 초기화되고 그리드 API에 ACCESS 할 준비가 되었을 때 호출되는 콜백함수를 정의함 (초기화작업을 주로 진행하는 콜백함수 등록)