체크 박스 렌더러를 사용 할 때 헤더에 전체 체크 설정 / 전체 체크 해제를 할 수 있도록 설정한 모습입니다.
다음처럼 headerRenderer 와 renderer 를 각각 "CheckBoxHeaderRenderer", "CheckBoxEditRenderer" 로 설정하면 dependentMode 활성화를 할 수 있습니다.
dataField : "isActive", headerText : "Active", headerRenderer : { type : "CheckBoxHeaderRenderer", // 헤더의 체크박스가 상호 의존적인 역할을 할지 여부(기본값:false) // dependentMode 는 renderer 의 type 으로 CheckBoxEditRenderer 를 정의할 때만 활성화됨. // true 설정했을 때 클릭하면 해당 열의 필드(데모 상은 isActive 필드)의 모든 데이터를 true, false 로 자동 바꿈 dependentMode : true, position : "bottom" // 기본값 "bottom" }, renderer : { type : "CheckBoxEditRenderer", showLabel : false, // 참, 거짓 텍스트 출력여부( 기본값 false ) editable : true, // 체크박스 편집 활성화 여부(기본값 : false) checkValue : "Active", // true, false 인 경우가 기본 unCheckValue : "Inactive" }
모든 데모는 각각 독립적인 단일 HTML 페이지입니다. 마우스 우클릭 후 "소스 보기" (또는 크롬 기준 단축키 Ctrl + U)로 어떻게 작성되었는지 쉽게 확인 할 수 있습니다.
Copyright © AUISoft Co., Ltd.