# 열 메뉴

열 메뉴는 현재 열에 대한 정렬·필터·표시 설정을 가까운 위치에서 제공합니다. 행의 업무 작업은 셀 컨텍스트 메뉴, 전체 열 목록 관리는 도구 패널과 구분합니다.

Canonical: https://grid.syidax.com/ko/docs/features/column-menu/

<a id="understand"></a>

## 동작 원리와 선택 기준

columnMenu로 메뉴를 켜고 columnMenuItems 콜백으로 항목 구성을 조절합니다. 개별 열의 정렬·필터·고정 가능 여부와 함께 설정해야 사용자가 누른 작업이 실제로 적용됩니다.

이 기능을 제품에서 사용하려면 Pro 패키지와 유효한 라이선스가 필요합니다. 설정 이름이 같더라도 Community에서 Pro 기능이 활성화되는 것은 아닙니다.

코드의 grid는 설치와 연결 장에서 준비한 Grid 요소입니다. 예제마다 필요한 데이터·설정을 확인하고, 코드에서 소개하는 앱 함수와 서버 주소는 프로젝트에 맞게 구현하세요.

- [설치와 연결 · 공통 예제 데이터](https://grid.syidax.com/ko/docs/guides/getting-started.md)

<a id="example-1"></a>

## 예제 1. 열 머리글 메뉴 켜기

정렬과 크기 조정이 가능한 표에 열 메뉴를 추가합니다.

```javascript
grid.columnMenu = true;
grid.defaultColDef = { sortable: true, resizable: true };
```

결과 확인: 제품·수량 등 각 머리글의 메뉴를 열어 해당 열을 대상으로 작업합니다.

<a id="example-2"></a>

## 예제 2. 관리자가 허용한 작업만 제공

columnMenuItems의 GridColumnMenuContext를 읽고 GridColumnMenuItem 배열을 반환합니다. 읽기 전용 보고서에서는 불필요한 변경 작업을 제외하고 필터·정렬 중심으로 구성합니다.

결과 확인: 메뉴 설정과 실제 API 제한이 일치하는지 확인합니다. 메뉴를 제거해도 앱에서 API를 호출할 수 있으므로 권한은 별도로 검증합니다.

<a id="example-3"></a>

## 예제 3. 열 숨김 후 다시 찾기

사용자가 열 메뉴로 열을 숨기는 구성을 제공한다면 sideBar의 columns 패널이나 별도 초기화 버튼도 제공합니다.

```javascript
grid.sideBar = 'columns';
```

결과 확인: 숨긴 열을 되살릴 경로가 생깁니다. 마지막으로 필요한 식별 열까지 사라져 표의 의미를 잃지 않게 기본 구성을 정합니다.

<a id="pitfalls"></a>

## 조합할 때와 문제를 해결할 때

머리글 클릭 정렬과 메뉴 열기가 충돌하지 않는지 키보드와 마우스로 확인하세요.

열 메뉴의 상태는 실제 열 객체와 열 상태 API로 확인합니다. 처음 작성한 columnDefs만으로 현재 화면 상태를 판단하지 마세요.

<a id="related-api"></a>

## 이 기능에 사용하는 API

- [columnMenu](https://grid.syidax.com/ko/docs/options/columnMenu.md) — 열 머리글에서 열에 관한 작업 메뉴를 사용할 수 있게 합니다.
- [columnMenuItems](https://grid.syidax.com/ko/docs/options/columnMenuItems.md) — 현재 열 문맥을 받아 사용자에게 제공할 열 메뉴 항목을 구성합니다.

<a id="next"></a>

## 함께 읽기

- [행·열·ID의 관계](https://grid.syidax.com/ko/docs/guides/concepts.md)
- [결과와 이벤트 연결](https://grid.syidax.com/ko/docs/guides/data-event-access.md)
- [Features에서 살펴보기](https://grid.syidax.com/grid/column-menu) — 직접 체험 가능한 범위는 해당 가이드에 안내되어 있습니다.