RealGrid2 API
Interface
CheckBar

CheckBar

체크바와 관련된 설정 모델

Signature:

export interface CheckBar 

Remarks

체크바 영역에서 shift를 누른 상태에서 이전의 행이나 이후의 행을 클릭하면 일괄체크

GridBase.setCheckBar() 사용시 필요한 정보만 입력하면 된다.

Example

gridView.setCheckBar({exclusive: true});

Events

PropertyTypeDescription
checkableCallbackCheckableCallback체크 가능 여부를 결정하는 콜백

Properties

PropertyTypeDescription
cellStyleCallbackRowBarCellStyleCallback셀의 스타일을 지정하기 위한 콜백
checkableExpressionstring체크 가능 여부의 수식
checkableOnlyboolean체크 가능한 행만 체크할 수 있는지의 여부
checkLocationColumnHeaderItemLocationcheckBox의 위치를 지정한다.
displayOrdernumber체크바, 상태바, 인디케이터 중에서 보여지는 순서 (인덱스)
exclusiveboolean한 행만 체크 가능한지의 여부
fieldNamestringcheckBar의 체크상태를 dataField와 연결한다.
focusMovebooleancheckBox를 클릭했을때 클릭된 행으로 focus이동여부
footTextstringfoot 영역에 표시할 텍스트
headTextstringhead 영역에 표시할 텍스트
headThreeStatesboolean일부만 체크되었을때 head영역의 checkBox에 일부선택 표시여부
itemGapnumbercheckBox와 headText의 간격을 지정한다.
mergeRulestringCheckBox 머지 규칙
popupMenuPopupMenuItem[] | string팝업 메뉴
showAllboolean체크바 헤드에 “v” 표시 여부
showFocusbooleanfocus 된 행에 해당하는 셀의 스타일 적용여부 여부
showGroupboolean행 그룹핑시 그룹 헤더 영역에 체크박스 표시 여부
showGroupFooterboolean행 그룹핑시 그룹 푸터 영역에 체크박스 표시 여부
showSelectionboolean데이터 선택 영역에 맞춰 관련된 셀들의 스타일 적용 여부
sumTextstringsummary 영역에 표시할 텍스트
syncHeadCheckboolean데이터 영역의 전체 item 체크 상태와 체크바의 헤드 연동 여부
toggleRadiobooleanexclusive가 true일때 radio의 check상태가 전환된다.
useImagesbooleancheckBar의 check를 image를 이용해서 표시한다.
visibleboolean표시 여부
visibleOnlyboolean체크바 헤드를 체크하여 전체선택 시 보이는 행만 체크할 것인지의 여부
widthnumber너비

Events Desc

checkableCallback

체크 가능 여부를 결정하는 콜백

Type - CheckableCallback

Remarks:

false 반환 시 체크가 불가능하다.

Example:

const f = function(dataSource, item) {
     if (item.value) {
         return item.value !== 'doNotCheck';
     }
     else {
         return false;
     }
}
 
gridView.setCheckBar({checkableCallback: f});

Properties Desc

cellStyleCallback

셀의 스타일을 지정하기 위한 콜백

Type - RowBarCellStyleCallback


checkableExpression

체크 가능 여부의 수식

Type - string


checkableOnly

체크 가능한 행만 체크할 수 있는지의 여부

Type - boolean

Remarks:

checkableExpression 에서 체크 가능 여부를 지정할 수 있다.


checkLocation

checkBox의 위치를 지정한다.

Type - ColumnHeaderItemLocation

Remarks:

headText가 표시될때 checkBox의 위치를 지정한다. checkBar의 너비 또는 GridHeader.height 높이를 적절히 변경해야 한다.


displayOrder

체크바, 상태바, 인디케이터 중에서 보여지는 순서 (인덱스)

Type - number

Remarks:

숫자가 작을 수록 왼쪽에 배치된다.


exclusive

한 행만 체크 가능한지의 여부

Type - boolean


fieldName

checkBar의 체크상태를 dataField와 연결한다.

Type - string


focusMove

checkBox를 클릭했을때 클릭된 행으로 focus이동여부

Type - boolean


footText

foot 영역에 표시할 텍스트

Type - string


headText

head 영역에 표시할 텍스트

Type - string


headThreeStates

일부만 체크되었을때 head영역의 checkBox에 일부선택 표시여부

Type - boolean


itemGap

checkBox와 headText의 간격을 지정한다.

Type - number


mergeRule

CheckBox 머지 규칙

Type - string

Remarks:

지정된 field에서 동일한 값을 가지는 행들의 CheckBox를 묶어서 보여지도록 한다.

Example:

gridView.checkBar.mergeRule = "values['fieldName']";
gridView.checkBar.mergeRule = "values['field1'] + values['field2']";

popupMenu

팝업 메뉴

Type - PopupMenuItem[] | string


showAll

체크바 헤드에 “v” 표시 여부

Type - boolean

Remarks:

표시 후 체크 시 전체 체크


showFocus

focus 된 행에 해당하는 셀의 스타일 적용여부 여부

Type - boolean

Remarks:

true면 focus 된 행에 해당하는 셀을 'rg-checkbar-focus' 스타일로 표시한다.


showGroup

행 그룹핑시 그룹 헤더 영역에 체크박스 표시 여부

Type - boolean


showGroupFooter

행 그룹핑시 그룹 푸터 영역에 체크박스 표시 여부

Type - boolean

Remarks:

CheckBar.showGroupfalse인 경우에는 값이 true여도 표시되지 않는다.


showSelection

데이터 선택 영역에 맞춰 관련된 셀들의 스타일 적용 여부

Type - boolean

Remarks:

true면 데이터 선택 영역에 맞춰 관련된 셀들을 'rg-checkbar-select' 스타일로 표시한다.


sumText

summary 영역에 표시할 텍스트

Type - string


syncHeadCheck

데이터 영역의 전체 item 체크 상태와 체크바의 헤드 연동 여부

Type - boolean

Remarks:

데이터행의 모든 item이 체크되면 Head영역에도 자동으로 체크가 됨


toggleRadio

exclusive가 true일때 radio의 check상태가 전환된다.

Type - boolean


useImages

checkBar의 check를 image를 이용해서 표시한다.

Type - boolean


visible

표시 여부

Type - boolean


visibleOnly

체크바 헤드를 체크하여 전체선택 시 보이는 행만 체크할 것인지의 여부

Type - boolean


width

너비

Type - number