이벤트

Bootstrap Table의 이벤트 API.

이 페이지에서

이벤트는 두 가지 방법으로 바인딩할 수 있습니다:

옵션 개체를 통해
jQuery 이벤트 핸들러를 통해

옵션 개체를 통한 바인딩:

// 이때 함수의 마지막 매개변수는 bootstrap-table 인스턴스입니다.

$('#table').bootstrapTable({
  onEventName: function (arg1, arg2, ...) {
    // ...
  }
})

jQuery 이벤트 핸들러를 통한 바인딩:

// 변수 e에서 sender 속성을 가져올 수 있으며, 이는 bootstrap-table 인스턴스입니다.

$('#table').on('event-name.bs.table', function (e, arg1, arg2, ...) {
  // ...
})

참고: jQuery 이벤트 핸들러를 사용하는 경우 이벤트가 트리거되기 전에 수신기를 바인딩해야 합니다!

참고: 다음 이벤트 이름(예: onCheck, onClickRow, onLoadSuccess)은 JavaScript를 사용하여 이벤트를 바인딩할 때 사용되는 정확한 이벤트 이름입니다.

onAll

jQuery 이벤트: all.bs.table
매개변수: name, args
세부 정보:

모든 이벤트가 트리거될 때 실행됩니다. 매개변수에는 다음이 포함됩니다:
- name: 이벤트 이름.
- args: 이벤트 데이터.

onCheck

jQuery 이벤트: check.bs.table
매개변수: row, $element
세부 정보:

사용자가 행을 선택할 때 트리거됩니다. 매개변수에는 다음이 포함됩니다:
- row: 선택된 행에 해당하는 레코드.
- $element: 선택된 DOM 요소.

onCheckAll

jQuery 이벤트: check-all.bs.table
매개변수: rowsAfter, rowsBefore
세부 정보:

사용자가 모든 행을 선택할 때 트리거됩니다. 매개변수에는 다음이 포함됩니다:
- rowsAfter: 현재 선택된 행에 해당하는 레코드 배열.
- rowsBefore: 이전에 선택된 행에 해당하는 레코드 배열.

onCheckSome

jQuery 이벤트: check-some.bs.table
매개변수: rows
세부 정보:

사용자가 일부 행을 선택할 때 트리거됩니다. 매개변수에는 다음이 포함됩니다:
- rows: 방금 선택된 행에 해당하는 레코드 배열.

onClickCell

jQuery 이벤트: click-cell.bs.table
매개변수: field, value, row, $element
세부 정보:

사용자가 셀을 클릭할 때 트리거됩니다. 매개변수에는 다음이 포함됩니다:
- field: 클릭된 셀에 해당하는 필드 이름.
- value: 클릭된 셀에 해당하는 데이터 값.
- row: 클릭된 행에 해당하는 레코드.
- $element: 해당 셀의 td 요소.

onClickRow

jQuery 이벤트: click-row.bs.table
매개변수: row, $element, field
세부 정보:

사용자가 행을 클릭할 때 트리거됩니다. 매개변수에는 다음이 포함됩니다:
- row: 클릭된 행에 해당하는 레코드.
- $element: 해당 행의 tr 요소.
- field: 클릭된 셀에 해당하는 필드 이름.

onCollapseRow

jQuery 이벤트: collapse-row.bs.table
매개변수: index, row, detailView
세부 정보:

세부 정보 아이콘을 클릭하여 세부 정보 보기를 접을 때 트리거됩니다. 매개변수에는 다음이 포함됩니다:
- index: 접힌 행의 인덱스.
- row: 접힌 행에 해당하는 레코드.
- detailView: 접힌 세부 정보 보기.

onColumnSwitch

jQuery 이벤트: column-switch.bs.table
매개변수: field, checked
세부 정보:

열의 표시/숨기기 상태를 전환할 때 트리거됩니다(showColumns 기능을 통해). 매개변수에는 다음이 포함됩니다:
- field: 전환된 열의 필드 이름.
- checked: 해당 열의 표시 상태(true는 표시, false는 숨김).

onColumnSwitchAll

jQuery 이벤트: column-switch-all.bs.table
매개변수: checked
세부 정보:

모든 열의 표시/숨기기 상태를 한 번에 전환할 때 트리거됩니다. 매개변수에는 다음이 포함됩니다:
- checked: 모든 열의 표시 상태.

onDblClickCell

jQuery 이벤트: dbl-click-cell.bs.table
매개변수: field, value, row, $element
세부 정보:

사용자가 셀을 더블 클릭할 때 트리거됩니다. 매개변수에는 다음이 포함됩니다:
- field: 클릭된 셀에 해당하는 필드 이름.
- value: 클릭된 셀에 해당하는 데이터 값.
- row: 클릭된 행에 해당하는 레코드.
- $element: 해당 셀의 td 요소.

onDblClickRow

jQuery 이벤트: dbl-click-row.bs.table
매개변수: row, $element, field
세부 정보:

사용자가 행을 더블 클릭할 때 트리거됩니다. 매개변수에는 다음이 포함됩니다:
- row: 더블 클릭된 행에 해당하는 레코드.
- $element: 해당 행의 tr 요소.
- field: 더블 클릭된 셀에 해당하는 필드 이름.

onExpandRow

jQuery 이벤트: expand-row.bs.table
매개변수: index, row, $detail
세부 정보:

세부 정보 아이콘을 클릭하여 세부 정보 보기를 펼칠 때 트리거됩니다. 매개변수에는 다음이 포함됩니다:
- index: 펼쳐진 행의 인덱스.
- row: 펼쳐진 행에 해당하는 레코드.
- $detail: 현재 tr 요소 뒤에 있는 세부 정보 div DOM 요소로, jQuery 메서드를 호출하여 세부 정보 보기를 사용자 정의할 수 있습니다.

onLoadError

jQuery 이벤트: load-error.bs.table
매개변수: status, jqXHR
세부 정보:

원격 서버에서 데이터를 로드하는 동안 오류가 발생할 때 트리거됩니다. 매개변수에는 다음이 포함됩니다:
- status: HTTP 상태 코드.
- jqXHR: jqXHR 개체로, XMLHttpRequest 개체의 상위 집합입니다. 자세한 내용은 jqXHR Type을 참조하세요.

onLoadSuccess

jQuery 이벤트: load-success.bs.table
매개변수: data
세부 정보:

원격 서버에서 데이터를 성공적으로 로드할 때 트리거됩니다. 매개변수에는 다음이 포함됩니다:
- data: 테이블에 로드된 데이터. (참고: 데이터가 테이블에 로드된 후에는 수정할 수 없습니다. 테이블 사용 전에 반환된 데이터를 처리해야 하는 경우 사용자 정의 responseHandler를 사용하세요.)
- status: HTTP 상태 코드.
- jqXHR: jqXHR 개체로, XMLHttpRequest 개체의 상위 집합입니다. 자세한 내용은 jqXHR Type을 참조하세요.

onPageChange

jQuery 이벤트: page-change.bs.table
매개변수: number, size
세부 정보:

페이지 번호 또는 페이지당 항목 수가 변경될 때 트리거됩니다. 매개변수에는 다음이 포함됩니다:
- number: 페이지 번호.
- size: 페이지당 항목 수.

onPostBody

jQuery 이벤트: post-body.bs.table
매개변수: data
세부 정보:

테이블 본문이 렌더링되고 DOM에 마운트된 후 트리거됩니다. 매개변수에는 다음이 포함됩니다:
- data: 렌더링된 데이터.

onPostFooter

jQuery 이벤트: post-footer.bs.table
매개변수: $tableFooter
세부 정보:

푸터가 렌더링되고 DOM에 마운트된 후 트리거됩니다. 매개변수에는 다음이 포함됩니다:
- $tableFooter: 푸터의 DOM 요소.

onPostHeader

jQuery 이벤트: post-header.bs.table
매개변수: undefined
세부 정보:

헤더가 렌더링되고 DOM에 마운트된 후 트리거됩니다.

onPreBody

jQuery 이벤트: pre-body.bs.table
매개변수: data
세부 정보:

테이블 본문이 렌더링되기 전에 트리거됩니다. 매개변수에는 다음이 포함됩니다:
- data: 렌더링될 데이터.

onRefresh

jQuery 이벤트: refresh.bs.table
매개변수: params
세부 정보:

새로고침 버튼을 클릭한 후 트리거됩니다. 매개변수에는 다음이 포함됩니다:
- params: 서버로 전송되는 추가 매개변수.

onRefreshOptions

jQuery 이벤트: refresh-options.bs.table
매개변수: options
세부 정보:

옵션을 새로고침한 후 테이블을 다시 초기화하기 전에 트리거됩니다. 매개변수에는 다음이 포함됩니다:
- options: 테이블 옵션 개체.

onResetView

jQuery 이벤트: reset-view.bs.table
매개변수: undefined
세부 정보:

테이블 보기를 재설정할 때 트리거됩니다.

onScrollBody

jQuery 이벤트: scroll-body.bs.table
매개변수: $tableBody
세부 정보:

테이블 본문이 스크롤될 때 트리거됩니다.

onSearch

jQuery 이벤트: search.bs.table
매개변수: text
세부 정보:

테이블 검색을 실행할 때 트리거됩니다. 매개변수에는 다음이 포함됩니다:
- text: 검색 상자의 텍스트.

onSort

jQuery 이벤트: sort.bs.table
매개변수: name, order
세부 정보:

사용자가 열을 정렬할 때 트리거됩니다. 매개변수에는 다음이 포함됩니다:
- name: 정렬된 열의 필드 이름.
- order: 정렬된 열의 정렬 순서.

onToggle

jQuery 이벤트: toggle.bs.table
매개변수: cardView
세부 정보:

테이블 보기를 전환할 때 트리거됩니다. 매개변수에는 다음이 포함됩니다:
- cardView: 테이블의 카드 보기 상태.

onTogglePagination

jQuery 이벤트: toggle-pagination.bs.table
매개변수: state
세부 정보:

페이지 매기기 상태를 전환할 때 트리거됩니다. 매개변수에는 다음이 포함됩니다:
- state: 새 페이지 매기기 상태(true는 페이지 매기기 활성화, false는 페이지 매기기 비활성화).

onUncheck

jQuery 이벤트: uncheck.bs.table
매개변수: row, $element
세부 정보:

사용자가 행 선택을 취소할 때 트리거됩니다. 매개변수에는 다음이 포함됩니다:
- row: 선택 취소된 행에 해당하는 레코드.
- $element: 선택 취소된 DOM 요소.

onUncheckAll

jQuery 이벤트: uncheck-all.bs.table
매개변수: rowsAfter, rowsBefore
세부 정보:

사용자가 모든 행 선택을 취소할 때 트리거됩니다. 매개변수에는 다음이 포함됩니다:
- rowsAfter: 현재 선택된 행에 해당하는 레코드 배열.
- rowsBefore: 이전에 선택된 행에 해당하는 레코드 배열.

onUncheckSome

jQuery 이벤트: uncheck-some.bs.table
매개변수: rows
세부 정보:

사용자가 일부 행 선택을 취소할 때 트리거됩니다. 매개변수에는 다음이 포함됩니다:
- rows: 이전에 선택된 행에 해당하는 레코드 배열.

onVirtualScroll

jQuery 이벤트: virtual-scroll.bs.table
매개변수: startIndex, endIndex
세부 정보:

가상 스크롤 영역을 스크롤할 때 트리거됩니다. 매개변수에는 다음이 포함됩니다:
- startIndex: 가상 스크롤의 시작 행 인덱스.
- endIndex: 가상 스크롤의 끝 행 인덱스.