그리드 설정

상태 표시(rowheader)

로우 헤더는 각 로우의 좌측에 있는 컬럼으로 로우에 대한 순차(sequence)와 역순(reverse), checkbox, state(CUD), 라디오 체크 방식을 지원하며 QCELL 그리드 설정 옵션으로 설정합니다.
그리고 로우 헤더의 열 인덱스는 0부터 시작하는점 참고하시길 바랍니다. => 0, 1, 2, 3...

Step 1: 로우 헤더 방식

로우 헤더는 표시할 행 번호 타입을 단일(rowheader) 또는 배열을 사용하여 여러 개(rowheaders)로 설정할 수 있습니다.

"rowheader": "sequence" || "rowheaders": ["sequence","checkbox"]
("sequence" | "reverse" | "checkbox" | "state"(순서가 아닌 상태)| "radio" | "custom")



sequence, checkbox, radio를 동시에 사용한 예시


로우 헤더의 state는 로우의 상태 정보를 보여주는 컬럼으로 행 추가, 데이터변경, 행 삭제 시 해당 rowheader 영역에 신호등으로 표현합니다.

- rt-qc-rowheader-state-init
- rt-qc-rowheader-state-insert
- rt-qc-rowheader-state-update
- rt-qc-rowheader-state-delete

Step 2: 로우 헤더 타이틀 및 너비 설정

rowheaderstitle는 rowheader 또는 rowheaders가 있는 헤더의 타이틀을 text로 입력 지원하는 옵션입니다.

rowheaderstitle : ["순번","역순","체크박스","상태","라디오"]

그리고 rowheaderwidth는 값(px 단위) 설정 시 해당 너비로 로우 헤더를 생성 해주는 옵션입니다.

rowheaderwidth : 60

Step 3: 로우 헤더에 custom 타입 컬럼 추가

'rowheader' : 'custom'을 사용 할 때 rowheaderoptions를 속성에 사용하여 콜백 함수를 정의하는 방식으로 설정합니다.

rowheaderoptions : [{ col : 3 , data : fnData, header : fnHeader}],

● col : 적용될 column 번호
● data : data 부분에 정의 될 callback 함수
● header : header 부분에 정의 될 callback 함수

# Step 4: checkbox 방식

로우 헤더 checkbox의 선택 여부에 대한 상호작용을 위해 checkbox 선택 관련 API를 지원합니다.

getRowheaderChecked(col) rowheader가 “checkbox” 일 때 체크된 로우들의 인덱스를 반환하는 API 입니다.

• QCell1.getRowheaderChecked(1);

setRowheaderChecked(row, col, state) rowheader "checkbox"로 입력받은 행,열 인덱스에 해당하는 checkbox의 상태값을 갱신합니다.

row: rowheader 중 checkbox이며 변경할 로우 index
col: rowheader 중 checkbox이며 변경할 컬럼 index
state: rowheader 중 checkbox 이며 변경할 상태값

• QCell1.setRowheaderChecked(1, 0, true);

setRowheaderCheckedArr(arrRow, col) rowheader "checkbox"로 입력받은 행의 배열,열 인덱스에 해당하는 checkbox를 check상태로 갱신합니다.

arrRow: rowheader 중 checkbox 이며 변경할 행 index들의 배열
col: rowheader 중 checkbox 이며 변경할 컬럼 index

• QCell1.setRowheaderCheckedArr([1, 3, 5], 0);

---