SYIDAX / DATA GRID

검색 가능한 선택 편집기 PRO

많은 선택지에서 검색과 선택으로 셀 값을 입력합니다.

시작하기
검색 가능한 선택 편집기샘플 주문 데이터
120 rows
Grid를 불러오는 중입니다…
최근 결과

사용자에게 보일 제품 이름과 실제 저장할 제품 코드를 정하세요. 이름과 코드는 서로 다를 수 있습니다.

코드 보기
현재 미리보기

사용 가이드

#

상품 코드처럼 선택지가 많아서 단순한 드롭다운을 훑어보기 어려울 때 사용합니다. 검색으로 후보를 좁힌 뒤 올바른 값을 고릅니다.

앱에서 연결하는 순서

  1. 선택지와 저장값 준비

    사용자에게 보일 제품 이름과 실제 저장할 제품 코드를 정하세요. 이름과 코드는 서로 다를 수 있습니다.

  2. 편집기 연결

    앱의 대상 열에 Rich Select 편집기와 선택지 목록을 연결합니다. 관련 ColumnDef API에서 편집기 선언 형식을 확인하세요.

  3. 검색·선택·취소 확인

    앱에서 셀을 편집하고 이름 일부를 검색해 값을 고르세요. Enter로 확정하거나 Escape로 취소했을 때 저장값을 확인합니다.

확인할 결과

많은 후보 중 검색한 값을 선택하고 그 값이 셀 데이터에 반영됩니다.

현재 표의 상태 셀은 일반 select 편집기입니다. 검색 가능한 Rich Select 예제로 오해하지 않도록 구분하세요. Rich Select는 Pro 기능입니다.

알아두면 쉬운 용어

선택지 label / value
사용자에게 보이는 이름과 실제 저장할 값입니다.
cellEditor
열의 셀 편집 UI를 지정하는 설정입니다.

제품에 이 기능을 적용하려면 Pro 런타임과 유효한 라이선스가 필요합니다.

API reference

#

ColumnDef2
ColumnDef타입 / 필수 여부설명
PRO 옵션
GridCellEditorDeclaration<TData, TValue, TContext>선택Named or direct lifecycle editor. Built-in editors continue to use `editor`.
PRO 옵션
'text' | 'number' | 'date' | 'select' | 'checkbox' | 'textarea' | 'autocomplete' | 'largeText'선택Built-in editor type.