SYIDAX / DATA GRID

모든 열에서 빠르게 찾기

한 번의 입력으로 여러 열에 걸쳐 일치하는 행을 찾습니다.

시작하기
모든 열에서 빠르게 찾기샘플 주문 데이터
120 rows
Grid를 불러오는 중입니다…

옵션

아래 항목을 바꾸면 Grid와 코드에 바로 반영됩니다.

최근 결과

이 예제는 검색창에 Platform이 입력된 상태로 시작합니다. 담당 팀이 Platform인 주문을 확인하세요.

코드 보기
현재 미리보기

사용 가이드

#

어느 열에 있는 값인지 찾기 전에, 제품명이나 팀 이름으로 주문을 빠르게 검색할 때 사용합니다.

직접 해보기

  1. 기본 검색 결과 확인

    이 예제는 검색창에 Platform이 입력된 상태로 시작합니다. 담당 팀이 Platform인 주문을 확인하세요.

  2. 다른 값 검색

    검색어를 Beacon으로 바꾸면 Beacon Lite 제품이 있는 행을 찾습니다. 검색은 한 열에만 제한되지 않습니다.

  3. 전체 목록으로 돌아가기

    검색어를 모두 지우세요. 다른 필터가 없다면 전체 주문이 다시 표시됩니다.

확인할 결과

입력할 때마다 일치하는 행만 남고, 실행 결과에 quickFilterText 값이 표시됩니다.

검색은 현재 Grid가 가진 데이터를 대상으로 합니다. 서버에 아직 내려받지 않은 주문까지 찾으려면 서버 조회와 검색 조건을 연결하세요.

알아두면 쉬운 용어

quickFilterText
전체 열을 대상으로 찾을 검색어입니다.
열 필터
특정 열에만 조건을 거는 별도의 검색 방식입니다.

핵심 API 예시

등록된 Grid 요소를 grid로 참조하는 앱 코드입니다.

grid.quickFilterText = 'Platform';
grid.quickFilterMode = 'and';

API reference

#

주요 속성

Attribute / Property타입 / 기본값설명
quickFilter
boolean기본값 falseMount the global quick filter toolbar above the grid header.
나머지 속성5
Attribute / Property타입 / 기본값설명
quickFilterText
string기본값 ''Initial quick filter value; later prop changes mirror into state.
quickFilterPlaceholder
string기본값 undefinedPlaceholder text for the quick filter input.
quickFilterMode
'and' | 'or'기본값 'and'Quick filter word mode.
quickFilterRegex
boolean기본값 falsewhen true, the quick-filter text is a regular expression tested against each cell (a row matches when any cell matches). An invalid / half-typed pattern falls back to showing all rows.
quickFilterDebounce
number기본값 150Debounce before quick filter re-runs the pipeline.
이벤트1
이벤트detail 타입설명
GridQuickFilterChangedDetailFires when the quick filter commits a new search value.