# 일반적인 이벤트 시나리오

## Content

이 페이지에서는 실제 SpreadJS 애플리케이션에서 자주 사용되는 이벤트 기반 패턴을 소개합니다.
각 시나리오는 실무에서 발생하는 요구 사항에 초점을 맞추고, 어떤 이벤트를 사용해야 하는지와 그 이유를 설명합니다.

## 다른 시트로 전환 방지

**요구 사항**
저장되지 않은 변경 사항이 있는 경우와 같이 특정 조건이 충족될 때까지 사용자가 현재 시트를 벗어나지 못하도록 합니다.
**사용 이벤트**
`ActiveSheetChanging`
**이유**
활성 시트가 변경되기 전에 발생하며 취소할 수 있습니다.

```javascript
spread.bind(GC.Spread.Sheets.Events.ActiveSheetChanging, function (sender, args) {
    var hasUnsavedChanges = true;

    if (hasUnsavedChanges) {
        if (!confirm("저장되지 않은 변경 사항이 있습니다. 계속하시겠습니까?")) {
            args.cancel = true;
        }
    }
});
```

## 특정 셀 편집 방지

**요구 사항**
제한된 행 또는 열의 편집을 차단합니다.
**사용 이벤트**
`EditStarting`
**이유**
셀이 편집 모드로 진입하기 전에 발생합니다.

```javascript
activeSheet.bind(GC.Spread.Sheets.Events.EditStarting, function (sender, args) {
    var restrictedColumn = 0;

    if (args.col === restrictedColumn) {
        args.cancel = true;
    }
});
```

## 커밋 전 입력값 검증

**요구 사항**
편집은 허용하되 값이 저장되기 전에 검증합니다.
**사용 이벤트**
`EditEnding`
**이유**
편집이 확정되기 전에 발생하며 편집기 값을 확인할 수 있습니다.

```javascript
activeSheet.bind(GC.Spread.Sheets.Events.EditEnding, function (sender, args) {
    var value = args.editingText;

    if (isNaN(value)) {
        alert("숫자 값만 입력할 수 있습니다.");
        args.cancel = true;
    }
});
```

## 데이터 변경 추적

**요구 사항**
셀 변경 내용을 기록하거나 백엔드 시스템과 동기화합니다.
**사용 이벤트**
`RangeChanged` 또는 `ValueChanged`
**이유**
셀 데이터가 변경된 후 발생합니다.

```javascript
activeSheet.bind(GC.Spread.Sheets.Events.RangeChanged, function (sender, args) {
    console.log("변경된 범위:",
        args.row,
        args.col,
        args.rowCount,
        args.colCount
    );
});
```

## 행 또는 열 크기 조정 차단

**요구 사항**
사용자가 행 높이 또는 열 너비를 변경하지 못하도록 합니다.
**사용 이벤트**

* `RowHeightChanging`
* `ColumnWidthChanging`

**이유**
크기 변경 전에 발생하며 취소를 지원합니다.

```javascript
activeSheet.bind(GC.Spread.Sheets.Events.RowHeightChanging, function (sender, args) {
    args.cancel = true;
});

activeSheet.bind(GC.Spread.Sheets.Events.ColumnWidthChanging, function (sender, args) {
    args.cancel = true;
});
```

## 정렬 작업 제한

**요구 사항**
특정 열에 대한 정렬을 허용하지 않습니다.
**사용 이벤트**
`RangeSorting`
**이유**
자동 정렬이 수행되기 전에 발생합니다.

```javascript
activeSheet.bind(GC.Spread.Sheets.Events.RangeSorting, function (sender, args) {
    var restrictedColumn = 2;

    if (args.col === restrictedColumn) {
        alert("이 열은 정렬할 수 없습니다.");
        args.cancel = true;
    }
});
```

## 도형 삭제 방지

**요구 사항**
시각적 요소가 삭제되지 않도록 보호합니다.
**사용 이벤트**
`ShapeRemoving`

```javascript
activeSheet.bind(GC.Spread.Sheets.Events.ShapeRemoving, function (sender, args) {
    args.cancel = true;
});
```

## 끌어서 놓기 작업 가로채기

**요구 사항**
셀 이동을 위한 끌어서 놓기 작업을 제어하거나 차단합니다.
**사용 이벤트**
`DragDropBlock`

```javascript
activeSheet.bind(GC.Spread.Sheets.Events.DragDropBlock, function (sender, args) {
    if (!args.copy) {
        args.cancel = true; // 복사는 허용, 이동은 차단
    }
});
```

## 잘라내기 작업 감지

**요구 사항**
잘라내기 작업 전에 사용자에게 경고를 표시합니다.
**사용 이벤트**
`ClipboardPasting`

```javascript
spread.bind(GC.Spread.Sheets.Events.ClipboardPasting, function (sender, args) {
    if (args.action === GC.Spread.Sheets.ClipboardActionType.cut) {
        if (!confirm("잘라내기 작업입니다. 계속하시겠습니까?")) {
            args.cancel = true;
        }
    }
});
```

## 리포트 시트에서 비즈니스 규칙 적용

**요구 사항**
변경 사항을 제출하기 전에 데이터를 검증합니다.
**사용 이벤트**

* `ReportSheetDataChanging`
* `ReportSheetRecordsSubmitting`

```javascript
report.bind(GC.Spread.Sheets.Events.ReportSheetDataChanging, function (sender, args) {
    if (args.newValue === null) {
        args.cancel = true;
    }
});
```