체크박스 헤더 렌더러는 특정 칼럼의 헤더에 체크박스가 출력되는 헤더 렌더러입니다.
체크박스 헤더 렌더러는 칼럼 레이아웃을 정의할 때 개별 칼럼의 headerRenderer 속성 값인 Object 형태로 선언되어야 합니다.
칼럼의 headerRenderer 속성의 type 으로만 설정 가능합니다.
아래는 설정 예제 입니다.
var columnLayout = [ {
dataField : "isAvailable",
headerText : "Avaliable",
width : 80,
headerRenderer : {
type : "CheckBoxHeaderRenderer",
position : "right", // headerText 기준 오른쪽에 위치
onClick : function(event) { // 클릭 이벤트 핸들러
alert("columnIndex : " + event.columnIndex + ", checked : " + event.checked);
}
}
}, {
...
}];
| Name | Description |
|---|---|
|
checkableFunction
| Type : Function Version: 3.0.7.1 사용자가 체크박스를 클릭하여 체크 상태를 변경하고자 할 때 변경을 허락할지 여부를 지정할 수 있는 함수 입니다. 파라메터 설명
Return : (Boolean) true 를 반환하면 사용자가 자유롭게 체크 변경이 가능하며, false 반환 시 체크 상태를 기존으로 유지시키고 기본 행위를 하지 않습니다. 함수 전체 작성 예는 다음과 같습니다. checkableFunction : function(columnIndex, isChecked, cItem) {
if(원하는 조건) {
return false; // false 반환하면 체크 상태 변경을 허락하지 않으며 기본행위 안함.
}
return true;
}
기본값(default) : null. |
|
checked
| Type : Boolean Version: 3.0.4 체크박스가 최초로 생성될 때 체크 여부를 지정합니다. dependentMode=true 를 설정하면 checked는 무시되고 데이터에 맞게 결정됩니다. 기본값(default) :false. |
|
dependentMode
| Type : Boolean Version: 3.0.4 그리드(바디)의 체크박스와 헤더의 체크박스가 상호 의존적으로 작용할지 여부를 지정합니다. 이 속성을 true 설정하면 헤더의 체크박스를 클릭했을 때 해당 열의 모든 값을 true | false 로 변경합니다. dependentMode 는 renderer 의 type 으로 CheckBoxEditRenderer 를 정의할 때만 활성화됩니다. dependentMode 는 그룹형 헤더에 정의한 경우 무시 됩니다. 일반 헤더에서만 사용 가능합니다. 기본값(default) :false. |
|
onClick
| Type : Function Version: 3.0.4 체크박스를 클릭했을 때 발생하는 이벤트 핸들러를 선언합니다. 이벤트 핸들러로 전달되는 파라메터의 event 객체 요소는 다음과 같습니다.
onClick 은 함수를 지정해야 하며 함수 형태는 다음과 같습니다. onClick : function(event) {
alert( event.columnIndex + " , " + event.checked );
}
기본값(default) : null. |
|
position
| Type : String Version: 3.0.4 체크박스가 출력될 위치를 지정합니다. 위치는 headerText 를 기준으로 지정한 위치에 렌더링 됩니다. 유효값은 "top", "bottom", "left", "right" 입니다. 기본값(default) :"bottom". |