SMART datagrid v1.4 > Examples

Back  Forward

Column Filtering  Example

그리드에 연결된 데이터셋의 모든 행 대신 ColumnFilter.expression으로 지정한 수식true를 리턴하는 조건에 맞는 행들만을 표시해야 할 때 ColumnFilter를 이용한다. 각 컬럼 별로 하나 이상의 필터를 설정할 수 있는데, ColumnFilter.active가 true인 컬럼 필터들 중 하나의 필터 조건에 해당되면 그리드에 표시된다. 

만일 그리드의 복수 개 컬럼에 active인 컬럼 필터들이 있다면, 필터가 있는 모든 컬럼의 조건에 해당되는 행들만 그리드에 표시된다. 즉, 개별 컬럼에서는 or, 행 단위로는 and 결합으로 필터가 적용된다. 

컬럼에 설정된 필터를 사용자가 직접 다루기 위해서는 먼저 GridBase.operateOptionsfilteringEnabledtrue로 지정돼야 한다. 컬럼 헤더의 필터 핸들을 클릭하면 필터 목록이 표시되고, 각 필터의 active 설정을 변경할 수 있다. Javascript api를 통한 컬럼 필터 설정은 filteringEnabled 설정과 상관 없다. 

아래 예제에서는 컬럼 생성 시 "단가" 컬럼에 필터들을 설정한다. 

Code -1
    {
        "name": "UnitPrice",
        "filters": [{
            "name": "High Price",
            "expression": "value > 800"
        }, {
            "name": "Mid Price",
            "expression": "(value > 500) && (value <= 800)"
        }, {
            "name": "Low Price",
            "expression": "value <= 500"
        }]
    }
Grid - 1
rows

스크립트를 통해서 컬럼 필터 목록을 재설정하거나, 개별 필터를 추가, 삭제할 수 있다. 또, 개별 필터나 전체 필터의 활성화 상태를 변경할 수 있다. 아래 버튼들은 국가 컬럼의 필터 설정들을 변경한다. 



'국가' 컬럼에 필터들을 설정한다.
'국가' 컬럼의 필터들을 모두 제거한다.
'발주일' 컬럼에 '2014년만 표시하는' 필터를 추가한다.
'발주일' 컬럼의 필터를 제거한다.

소스보기 JSP 

See Also
ColumnFilter
수식 개요
GridBase.operateOptions
OperateOptions.filteringEnabled
OperateOptions.filterSelector
DataColumn.filters
DataColumn.clearFilters
DataColumn.addFilters
DataColumn.removeFilters
DataColumn.activateFilters
DataColumn.activateAllFilters
Examples
Tree Filtering
Row Filtering