GS인증 AUIGrid v3.0.15

그리드의 모든 필드에 필터링을 사용할 수 있도록 설정한 예제입니다.

필터 메뉴는 그리드 속성 enableFilter=true 설정, 칼럼레이아웃에서 filter : { showIcon : true} 설정하면 사용할 수 있습니다.

헤더의 필터링 아이콘을 클릭하여 나오는 필터 메뉴에서 필터링을 할 수 있습니다.

기본적으로 해당 칼럼에 있는 값들을 모두 체크박스 형태로 출력 시키나 고유값들이 너무 많은 경우 지정된 최대 개수(filterMenuItemMaxCount 속성)만큼 출력 시키고 하단에 출력시킬 값이 더 이 있다는 메세지를 출력시킵니다.

필드의 값이 없는 경우(null, "", 필드 지정안 한 경우(typeof === "undefined")) 필드 메뉴에는 "(필드 값 없음)" 으로 표시됩니다.

Price 는 유형이 숫자로 숫자 필터링을 지정한 모습입니다.

정렬 후 필터링, 필터링 후 정렬 형태로 데이터를 쉽게 분석할 수 있도록 제공합니다.

필터 메뉴 크기 조절(resizing) : 우측 하단 손잡이 드래깅 조절 가능

필터 메뉴 이동(moving) : 메뉴의 상단 드래깅으로 이동 가능

이름이 Anna, Emma 만 필터링하기 이름이 Kim, Anna 이고 나라가 대한민국인 사람만 필터링하기