Description

그리드 수준에서 관리되는 표시 정보들에 대한 설정 모델이다.

Properties

columnResizable
Type: Boolean
Default: true
true면 사용자가 컬럼 헤더셀 우측을 마우스 드래깅해서 컬럼의 너비를 변경할 수 있다.

columnMovable
Type: Boolean
Default: true
true면 사용자가 컬럼 헤더셀을 마우스 드래깅해서 그룹 내에서 컬럼의 위치를 변경할 수 있다.

parentChangable
Type: Boolean
Default: false

defaultColumnWidth
Type: Number
Default: 120
기본 컬럼 폭을 지정한다.

fitStyle
Type: GridFitStyle
Default: GridFitStyle.NONE
그리드의 너비에 맞춰 컬럼들의 너비를 조정한다. GridFitStyle을 참조한다.

rowResizable
Type: Boolean
Default: false
true면 사용자가 첫 번째 행의 Indicator나 첫 번째 컬럼 셀의 아래쪽을 마우스 드래깅해서 행의 높이를 변경할 수 있다.

defaultRowHeight
Type: Number
Default: 0
@Deprecated rowHeight를 대신 사용할 것.

rowHeight
Type: Number
Default: 0
0 이면 그리드의 폰트와 Padding 스타일들을 고려해서 적절한 값으로 행들의 높이를 찾는다. 0보다 큰 값이면 지정한 값이 행들의 높이가 된다.

minRowHeight
Type: Number
Default: 4
최소 행 높이를 픽셀 단위로 지정한다.

hscrollBar
Type: Boolean
Default: true
true면 필요한 경우 수평 스크롤바를 표시한다.

vscrollBar
Type: Boolean
Default: true
true면 필요한 경우 수직 스크롤바를 표시한다.

horizLiveScroll
Type: Boolean
Default: true
false이면 횡 스크롤이 끝날때 표시되고 true이면 횡 스크롤 되는 중에도 표시된다.
RealGridJS만 지원

horzScrollStep
Type: Number
Default: 8
최소 수평 스크롤 크기를 픽셀 단위로 지정한다.
RealGridJS만 지원

showEmptyMessage
Type: Boolean
Default: false
데이터가 없을 경우 그리드에 메시지 표시 여부를 지정한다.
RealGridJS만 ver 1.1.22부터 지원된다.

emptyMessage
Type: String
Default: “Load data…”
그리드에 표시되는 내용이 한건도 없을 때 표시되는 문자열을 지정한다.

heightMeasurer
Type: String
Default: null
defaultRowHeight가 0일 때 행 높이를 결정하는 방법, null이면 데이터에 따라 자동으로 결정된다. “fixed”, “simple”

fitWhenResized
Type: Boolean
Default: true
Grid 크기가 변경될 때 가로 Scroll 위치를 계산하여 변경

liveScroll
Type: Boolean
Default: true
false이면 종 스크롤이 끝날때 표시되고 true이면 종 스크롤 되는 중에도 표시된다.

focusVisible
Type: Boolean
Default: true
포커스의 보임 여부를 지정한다.

focusColor
Type: String
Default: “#555555”
포커스의 색상을 지정한다. (포커스 셀의 외곽선)
RealGridJS 1.1.20부터 지원한다.

focusBackground
Type: String
Default:
포커스의 배경 색상을 지정한다.
RealGridJS 1.1.22부터 지원된다.

focusActiveColor
Type: String
Default: NaN
포커스 셀이 에디팅 되었을때 색상을 지정한다. (에디팅 포커스 셀의 외곽선)
RealGridJS 1.1.20부터 지원된다.

innerFocusColor
Type: String
Default: NaN
머지 셀의 내부 포커스 색상을 지정한다.
RealGridJS 1.1.20부터 지원된다.

focusBorderWidth
Type: String
Default: NaN
포커스의 경계선 굵기를 지정한다.
RealGridJS 1.1.20부터 지원된다.

rightClickable
Type: Boolean
Default: true
마우스 오른쪽 버튼 사용 가능 여부를 지정한다.

editItemMerging
Type: Boolean
Default: false
Merged Row Grouping 또는 Cell Merging상태에서 셀 편집시 편집중인 행의 분리 여부를 지정한다.

showInnerFocus
Type: Boolean
Default: true
Merged Cell에서 개별 cell 영역 표시 여부를 지정한다.
RealGridJS만 지원

rowChangeDelay
Type: number
Default: 0
onCurrentRowChanged()를 지연시켜 발생시키길 원할때 지정한다. 단위는 밀리초(ms)이다.
RealGridJS만 지원

toastZIndex
Type: number
Default: 3000
표시되는 토스트 창의 zIndex를 지정한다.

hintDuration
Type: number
Default: 0
tooltip을 지연시켜 발생시키길 원할때 지정한다. 단위는 밀리초(ms)이다.
RealGridJS 1.1.21부터 지원된다.

eachRowResizable
Type: boolean
Default: false
true로 설정하면 행 높이를 개별로 조절할 수 있다.
RealGridJS 1.1.21부터 지원된다.

rowFocusVisible
Type: Boolean
Default: true
행 포커스의 보임 여부를 지정한다.
RealGridJS 1.1.22부터 지원된다.

rowFocusBackground
Type: String
Default:
행 포커스의 배경 색상을 지정한다.
RealGridJS 1.1.22부터 지원된다.

emptyShowTooltip
Type: Boolean
Default: false
true로 지정하면 데이터가 없는 경우에도 onShowTooltip() 이 발생한다.
RealGridJS 1.1.24부터 지원된다.

rowHoverMask
Type: RowHoverMaskObject
Default:
마우스 호버링시 그리드의 행 선택 영역 표시를 보여준다.
RealGridJS 1.1.24부터 지원된다.

rowFocusMask
Type: RowFocusMaskObject
Default:
행 및 셀 선택시 그리드의 행 선택 영역 표시를 보여준다.
RealGridJS 1.1.25부터 지원된다.

useCssStyleProgress
Type: Boolean
Default: false
프로그래스바에 CSS Style을 적용할 것인지의 여부를 지정한다.
RealGridJS 1.1.25부터 지원된다.

popupDropdownCount
Type: Number
Default: 0
팝업이나 컨택스트 메뉴의 한 화면에 표시되는 목록들의 개수를 지정한다.
RealGridJS 1.1.26부터 지원된다.

wheelEventPropagate
Type: Boolean
Default: true
false로 지정하면 그리드내에서 발생할 휠 이벤트가 외부로 전파되지 않는다.
RealGridJS 1.1.29부터 지원된다.

hscrollBar
Type: Boolean
Default: true
수평 스크롤바의 표시여부를 지정한다.
RealGridJS 1.1.29부터 지원된다.

vscrollBar
Type: Boolean
Default: true
수직 스크롤바의 표시여부를 지정한다.
RealGridJS 1.1.29부터 지원된다.

drawBorderTop
Type: Boolean
Default: true
Grid영역의 Border Top의 표시여부를 지정한다.
RealGridJS 1.1.31부터 지원된다.

drawBorderBottom
Type: Boolean
Default: true
Grid영역의 Border Bottom의 표시여부를 지정한다.
RealGridJS 1.1.31부터 지원된다.

drawBorderLeft
Type: Boolean
Default: true
Grid영역의 Border Left의 표시여부를 지정한다.
RealGridJS 1.1.31부터 지원된다.

drawBorderRight
Type: Boolean
Default: true
Grid영역의 Border Right의 표시여부를 지정한다.
RealGridJS 1.1.31부터 지원된다.

cursorCallback
Type: function(grid, index, focused){}
grid: gridView객체
index: CellIndex
focused: 포커스 여부
Cell별로 마우스 포인터를 지정하고 싶을때 사용한다.
RealGridJS 1.1.31부터 지원한다.

scrollMessageCallback
Type: function(grid, vertical, itemIndex){}
liveScoroll: false일때 스크롤바에 현재 위치를 표시하거나 메세지를 표시할때 사용한다.
RealGridJS 1.1.35부터 지원한다.

vscrollBarVisibility
Type: ScrollBarVisibility
Default: default
always이면 수직스크롤바가 항상 표시되도록 할때 사용한다.
RealGridJS 1.1.44부터 지원한다.

hscrollBarVisibility
Type: ScrollBarVisibility
Default: default
always이면 수평스크롤바가 항상 표시되도록 할때 사용한다.
RealGridJS 1.1.44부터 지원한다.

Examples

<style>
  .rg-progress {
    background-color: rgba(0, 111, 245, 0.05);
      border: 1px solid #ddd;
  }
  .rg-progress-bar {
    background : linear-gradient(#aaa, #ccc);
    border : 1px solid #333;
  }
  .rg-progress-progress {
    background : linear-gradient(#fff, #ddd);
    border-right : 1px solid #333;
  }
  .rg-progress-message {
    font-size : 11px;
    font-family : Tahoma;
    font-weight : bold;
  }
</style>

gridView.setDisplayOptions({
    columnResizable: true,
    columnMovable: true,
    rowHeight: 40,    
    rowHoverMask: {
    	visible: true,
    	hoverMask: "row",
    	styles: {
    		background:"#30c0c0c0"
    	}
    },
    useCssStyleProgress: true
});


gridView.setDisplayOptions({
  cursorCallback:function(grid, index, focused) {
    return focused ? "pointer" : "default";
  }
});

//liveScoroll: false일때 scrollMessageCallback을 사용하여 스크롤바에 현재 위치를 표시하거나 메세지를 표시하는 예제  
<style>
.rg-scroll-tip-view {
	border: 1px solid red;
	background: white;
	font-size: 12px;
	white-space: nowrap;
	border-radius: 4px;
}
</style>

gridView.setDisplayOptions({
  liveScroll: false, 
	scrollMessageCallback:function(grid, vertical, itemIndex) { 
		var dataRow = grid.getDataRow(itemIndex); 
		if (dataRow >= 0) {
			return ""+grid.getDataSource().getValue(dataRow, "highwayname")+""
		}
	}
})