SYIDAX / DATA GRID
셀 범위 선택 PRO
여러 행과 열에 걸친 직사각형 범위를 선택합니다.
셀 범위 선택샘플 주문 데이터
120 rowsGrid를 불러오는 중입니다…
옵션
아래 항목을 바꾸면 Grid와 코드에 바로 반영됩니다.
최근 결과
첫 주문의 수량 셀을 누르세요. 이 메뉴는 범위 선택 옵션이 켜진 상태로 시작합니다.
코드 보기
현재 미리보기
코드에 포함된 샘플 데이터 · 6행
사용 가이드
#스프레드시트처럼 여러 행과 열에 걸친 셀 영역을 선택할 때 사용합니다. 행 전체를 체크하는 기능과는 별개입니다.
직접 해보기
- 시작 셀 선택
첫 주문의 수량 셀을 누르세요. 이 메뉴는 범위 선택 옵션이 켜진 상태로 시작합니다.
- 선택 범위 늘리기
Shift를 누른 채 방향키를 사용하거나, 셀에서 다른 셀까지 드래그해 직사각형 영역을 만드세요.
- 선택 결과 확인
표 아래 rangeSelectionChanged에서 범위 정보를 확인하세요. 다른 셀을 선택해 범위를 새로 만들 수도 있습니다.
확인할 결과
선택한 셀 영역에 테두리와 배경이 표시되고 시작·끝 범위를 읽을 수 있습니다.
범위 선택 자체는 값을 바꾸지 않습니다. 복사·붙여넣기와 값 채우기는 별도 동작이며 편집 가능한 셀에만 적용됩니다.
알아두면 쉬운 용어
- 셀 범위
- 여러 셀을 묶은 직사각형 영역입니다.
- rowSelection
- 체크박스로 행 전체를 선택하는 별도 설정입니다.
제품에 이 기능을 적용하려면 Pro 런타임과 유효한 라이선스가 필요합니다.
API reference
#주요 속성
| Attribute / Property | 타입 / 기본값 | 설명 |
|---|---|---|
PRO rangeSelection | boolean기본값 false | cell range selection (AG `enableRangeSelection` parity). Drag selects a rectangle, shift+click / shift+arrows extend the anchor, ctrl/meta+drag adds ranges, Escape clears. Coordinates are DISPLAY indexes: data transitions (sort/filter/pagination/ collapse) keep ranges but clamp them into the new shape. Sentinel rows (group/tree/detail) never anchor a range (a sweep may cross them - those rows simply don't paint). The viewport does NOT autoscroll while dragging past its edge (v1 - documented). |
이벤트1
| 이벤트 | detail 타입 | 설명 |
|---|---|---|
PRO | { ranges: CellRangeBounds[] } | fires when the committed cell ranges change (normalized bounds). |
메서드4
| 메서드 / 인수 | 반환 타입 | 설명 |
|---|---|---|
PRO | Promise<CellRangeBounds[]> | committed cell ranges as normalized inclusive bounds. |
PRO | Promise<void> | clear every cell range (emits when something was cleared). |
PRO | Promise<SyGridCanonicalRange[]> | the canonical range set (stable ids + anchor/focus). |
PRO ranges: SyGridCellRangeInput[] | Promise<SyGridCanonicalChange[]> | replace the canonical selection through the transitions and mirror it into the legacy `rangeState`. Emits the existing `rangeSelectionChanged` (one selection event surface — no new event). Returns the typed change list (`removed` for every prior range, then one `added` per applied input, ids monotonic). |
EXPLORE CAPABILITIES
기능별로 자세히 살펴보기
기능별 사용 상황과 설정 방법을 살펴보세요. 직접 체험하는 예제와 앱에서 연결하는 기능을 각 가이드에 안내합니다.