사용자 정의 에디트렌더러(CustomEditRenderer)는 그리드에서 제공되는 기본 에디트렌더러가 아닌 사용자(개발자)가 직접 작성한 에디터를 그리드의 editRenderer 로 정의하여 셀 수정 방식을 결정할 수 있는 에디트렌더러 입니다.
사용자 정의 에디트렌더러는 칼럼의 editRenderer 에 "CustomEditRenderer" 를 type으로 지정하고, 실제 사용자가 작성한 js 파일을 jsClass 값으로 설정합니다.
사용자 정의 에디트렌더러는 칼럼 레이아웃을 정의할 때 개별 칼럼의 editRendrerer 속성 값인 Object 형태로 선언되어야 합니다.
칼럼의 editRenderer 속성의 type 으로만 설정 가능합니다.
아래는 설정 예제 입니다.var columnLayout = [ { ... }, { dataField : "color", headerText : "컬러", width : 160, editRenderer : { type : "CustomEditRenderer", // 사용자 정의 에디트렌더러 사용 jsClass : AUIGrid.SpectrumEditor // 작성한 사용자 정의 에디트렌더러 JS } }];
사용자 정의 에디트렌더러 사용에 대한 사전 스킬 요구 사항
사용자 정의 에디트렌더러 사용의 장점
사용자 정의 렌더러 사용의 단점
Name | Description |
---|---|
extraProps
| Type : Object Version: 3.0.14 CustomEditRenderer 에 전달할 여분의 속성을 설정합니다. 여기서 작성한 extraProps 는 사용자가 작성한 클래스에서 this.extraProps 로 접근 가능합니다. 기본값(default) :null . |
fitHeight
| Type : Boolean Version: 3.0.14 에디트렌더러의 세로 크기를 해당 셀의 세로 크기와 동일하게 맞춰 표시할지 여부를 지정합니다. 기본값(default) :false . |
fitWidth
| Type : Boolean Version: 3.0.14 에디트렌더러의 가로 크기를 해당 셀의 가로 크기와 동일하게 맞춰 표시할지 여부를 지정합니다. 기본값(default) :false . |
height
| Type : Number Version: 3.0.14 에디트렌더러의 세로 크기를 명시적으로 지정합니다. 기본값(default) :NaN . |
hPosition
| Type : String Version: 3.0.14 에디트렌더러가 표시될 때 셀 기준으로 왼쪽과 오른쪽 중 표시될 자리를 지정합니다. 유효값은 "left", "right" 입니다. 기본값(default) :"left" . |
jsClass
| Type : Class Version: 3.0.14 사용자가 그리드의 에디트렌더러로 작성한 클래스를 설정합니다. 작성한 클래스는 AUIGrid.Class 를 이용하여 AUIGrid.EditRendererBase 클래스를 확장(extend)하여 작성하여야 합니다. 기본값(default) :null . |
offsetLeft
| Type : Number Version: 3.0.14 에디트렌더러가 표시될 때 X 위치에 추가 값을 지정합니다. 예로 이 속성을 20 설정하면 20px 오른쪽으로 이동하여 에디트렌더러가 출력됩니다. 기본값(default) :NaN . |
offsetTop
| Type : Number Version: 3.0.14 에디트렌더러가 표시될 때 Y 위치에 추가 값을 지정합니다. 예로 이 속성을 20 설정하면 20px 하단으로 이동하여 에디트렌더러가 출력됩니다. 기본값(default) :NaN . |
vPosition
| Type : String Version: 3.0.14 에디트렌더러가 표시될 때 셀 기준으로 상단과 하단 중 표시될 자리를 지정합니다. 유효값은 "top", "bottom" 입니다. 기본값(default) :"bottom" . |
width
| Type : Number Version: 3.0.14 에디트렌더러의 가로 크기를 명시적으로 지정합니다. 기본값(default) :NaN . |