SYIDAX / DATA GRID

열마다 다른 조건

텍스트와 숫자 등 값의 종류에 맞는 열 필터를 사용합니다.

시작하기
열마다 다른 조건샘플 주문 데이터
120 rows
Grid를 불러오는 중입니다…

옵션

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

최근 결과

이 메뉴에서는 열 필터가 켜져 있습니다. 헤더 아래 제품 필터에 Atlas를 입력해 보세요.

코드 보기
현재 미리보기

사용 가이드

#

제품 이름과 수량 조건처럼 서로 다른 열에 조건을 걸어 필요한 주문만 남길 때 사용합니다.

직접 해보기

  1. 열별 입력칸 찾기

    이 메뉴에서는 열 필터가 켜져 있습니다. 헤더 아래 제품 필터에 Atlas를 입력해 보세요.

  2. 조건 함께 사용

    다른 열의 필터도 사용하면 두 조건에 맞는 행만 남습니다. 숫자 열은 숫자용 조건을 사용합니다.

  3. 필터 지우기

    입력한 조건을 지우고 주문이 다시 나타나는지 확인하세요. 열 필터 옵션을 끄면 필터 입력줄의 표시도 바뀝니다.

확인할 결과

조건에 맞는 주문만 보이고 filterChanged 이벤트에서 변경한 열과 필터 조건을 확인할 수 있습니다.

이 예제는 열 필터만 사용합니다. 예상보다 적은 행이 보이면 다른 열에 남아 있는 조건도 확인하세요.

알아두면 쉬운 용어

headerFilterRow
헤더 아래에 필터 입력줄을 표시하는 설정입니다.
filter
해당 열에 사용할 텍스트·숫자 등의 필터 종류입니다.

API reference

#

주요 속성

Attribute / Property타입 / 기본값설명
headerFilterRow
boolean기본값 falserender an inline filter row under the column headers (AG Grid "floating filters"). Scalar columns get an input that edits the current condition's value in place; set/multi/range states show a summary that opens the full dropdown. Default `false`.
이벤트2
이벤트detail 타입설명
GridFilterChangedDetailFires when a column filter is applied, replaced, or cleared.
GridFilterModifiedDetailFires when a lifecycle filter reports an unapplied UI modification.
메서드8
메서드 / 인수반환 타입설명
Promise<SyGridFilterSlice>The complete global filter model (built-in, custom, quick, condition).
model: SyGridFilterSlice | null
Promise<FilterSliceApplyResult['report']>Replace the global filter model; `null` clears every filter family. Custom models flow through the Phase C facade and are awaited, so the returned report reflects async completion. Fail-closed: an invalid model returns its issues in `invalidBuiltIn` semantics with zero writes.
columnId: string
Promise< GridFilterInstance<GridData, TColumnValue, TModel, unknown> | null >Return the mounted lifecycle filter instance for one column.
columnId: string
Promise<TModel | null>Read the canonical lifecycle-filter model owned by the grid facade.
columnId: string, model: TModel | null
Promise<boolean>Set one lifecycle-filter model and await floating/peer synchronization.
Promise<void>Synchronize models after an advanced caller mutates a raw filter instance. Prefer setColumnFilterModel for normal application code.
columnId: string
Promise<boolean>Destroy a lifecycle filter and schedule deterministic lazy recreation.
columnId: string, options?: { preserveModel?: boolean }
Promise<boolean>Recreate a mounted lifecycle filter, optionally retaining its model.
ColumnDef2
ColumnDef타입 / 필수 여부설명
PRO 옵션
| ColumnFilterDecl | string | GridFilterDefinition<TData, TValue, unknown, TContext>선택Filter type. `true` enables the built-in text filter; `false` disables it. an ordered array stacks several kinds on this column in one dropdown, AND-combined — see .
| string | GridFloatingFilterDefinition<unknown, TContext>선택Optional lifecycle floating filter rendered in the header filter row.