[Tui-Grid]-이벤트

Idel·2023년 8월 28일
0

개발블로그

목록 보기
19/19

GridEvent

이벤트가 발생한 경우, GridEvent 인스턴스는 이벤트에 등록된 핸들러로 넘겨진다.
GridEvent 인스턴스에는 이벤트 핸들러에서 유용하게 사용할 수 있는 정보가 담겨있다.
예를 들어 click 이벤트가 발생한 경우, rowKey, targetType, columnName 값이 GridEvent
인스턴스에 저장되고 이를 이용하여 사용자는 타겟 셀의 주소를 알 수 있다.

grid.on('click', (ev) => {
  if (ev.rowKey === 3 && ev.columnName === 'col1') {
    // do something
  }
});

사용할 수 있는 이벤트


click : 테이블 셀을 마우스로 클릭한 경우
dblclick : 테이블 셀을 마우스로 더블 클릭한 경우
mousedown : 테이블 셀을 마우스로 누른 경우
mouseover : 테이블 셀에 마우스 포인터가 들어간 경우
mouseout : 테이블 셀에서 마우스 포인터가 벗어난 경우
focusChange : 테이블 셀 포커스를 선택한 경우
columnResize : 컬럼의 너비를 조정한 경우
check: 로우 헤더의 체크 박스를 선택한 경우
uncheck: 로우 헤더의 체크 박스를 해제한 경우
checkAll: 헤더의 체크 박스를 선택하여 로우 헤더의 모든 체크 박스가 선택된 경우
uncheckAll: 헤더의 체크 박스를 해제하여 로우 헤더의 모든 체크 박스가 해제된 경우
selection: 테이블에서 선택 영역을 변경한 경우
editingStart: 테이블에서 셀 편집을 시작한 경우
editingFinish: 테이블에서 셀 편집을 종료한 경우
beforeSort : 데이터를 정렬하기 전
afterSort : 데이터를 정렬한 후
beforeUnsort : 데이터의 정렬이 해제되기 전
afterUnsort : 데이터의 정렬이 해제된 후
sort : 데이터를 정렬한 후 (deprecated 됨 afterSort를 사용하라)
beforeFilter : 데이터를 필터링하기 전
afterFilter : 데이터를 필터링한 후
beforeUnfilter : 데이터의 필터링이 해제되기 전
afterUnfilter : 데이터의 필터링이 해제된 후
filter : 데이터를 필터링한 경우 (deprecated 됨 afterFilter를 사용하라)
beforePageMove : 페이지를 이동하기 전
afterPageMove : 페이지를 이동한 후
scrollEnd : 스크롤 위치가 가장 하단에 도달한 경우
beforeChange: 하나 또는 여러 개의 셀 값이 변경되기 전
afterChange: 하나 또는 여러 개의 셀 값이 변경된 후
dragStart: 드래그하여 로우의 이동을 시작했을 때(draggable 옵션이 활성화된 경우만 발생)
drag: 드래그하여 로우를 이동하는 중(draggable 옵션이 활성화된 경우만 발생)
drop: 드래그가 끝나고 로우 이동을 완료하였을 때(draggable 옵션이 활성화된 경우만 발생)
keydown: 키 입력을 하였을 때(편집 중에는 발생하지 않음)

0개의 댓글