====== 멀티라인그리드 기본 가이드 ======
멀티라인그리드 컴포넌트에 대한 기븐 기능 예시 화면이다.
멀티라인그리드는 한 행을 서브행(로우)라는 개념으로 분할하여 처리하는 기능이다.
서브로우의 수 및 데이터부의 병합은 그리드 수평헤더 수 및 헤더부 병합에 따라 정의된다. (subrow_mode 속성이 0:header인 경우)
===== 예시 =====
setcolumnsoftfunc 함수 호출후, 그리드 헤더를 클릭해서 기능 확인
템플릿 위치: /HTML5/COMPONENT/MULTILINEGRID/multilinegrid_basic
템플릿 파일
* [[xf5projecthome>template/screen/HTML5/COMPONENT/MULTILINEGRID/multilinegrid_basic.xml|multilinegrid_basic.xml]]
* [[xf5projecthome>template/screen/HTML5/COMPONENT/MULTILINEGRID/multilinegrid_basic.js|multilinegrid_basic.js]]
* [[xf5projecthome>template/template.html?xframe_screen_url=/HTML5/COMPONENT/MULTILINEGRID/multilinegrid_basic|새창으로 실행]]
echo '';
echo '';
echo '';
==== 화면 스크립트 ====
function btn_rowadd_on_mouseup(objInst)
{
var row_index, ret;
// 단순 행 추가.
// 많은 행을 추가하는 경우에는 additemex API를 사용 권고(bRepaint 파라미터 활용)
row_index = grdList.addrow();
// 초기 데이터 설정 여부 및 그리드 리프레쉬 여부 지정 기능
row_index = grdList.additem();
// 행을 특정 위치에 삽입 처리
ret = grdList.insertitemtext(grdList.getrowcount(), 0, "");
}
function btn_gethorzheadercount_on_mouseup(objInst)
{
// 수평헤더행의 갯수를 구함
screen.alert("행갯수: " + grdList.gethorzheadercount());
}
function btn_subrowcount_on_mouseup(objInst)
{
// 서브행의 갯수를 구함
screen.alert("행갯수: " + grdList.getsubrowcount());
}
function btn_rowcount_on_mouseup(objInst)
{
// 행의 갯수를 구함
screen.alert("행갯수: " + grdList.getrowcount());
}
function btn_rowdeleteall_on_mouseup(objInst)
{
// 그리드 모든 행 삭제
grdList.deleteall();
}
function btn_rowdelete_on_mouseup(objInst)
{
var select_row;
// 현재 선택된 행을 구함
select_row = grdList.getselectrow();
// 행 삭제
grdList.deleterow(select_row);
}
function btn_getitemtext_on_mouseup(objInst)
{
var select_row, select_subrow, select_column;
// 현재 선택된 행/열을 구함
select_row = grdList.getselectrow();
select_subrow = grdList.getselectsubrow();
select_column = grdList.getselectcolumn();
screen.alert("아이템 값: " + grdList.getitemtext(select_row, select_subrow, select_column));
}
function btn_setitemtext_on_mouseup(objInst)
{
var select_row, select_subrow, select_column;
// 현재 선택된 행/열을 구함
select_row = grdList.getselectrow();
select_subrow = grdList.getselectsubrow();
select_column = grdList.getselectcolumn();
grdList.setitemtext(select_row, select_subrow, select_column, "1");
}
function btn_itemloop_on_mouseup(objInst)
{
var row, subrow, column, row_count, sub_row_count, column_count, row_data_arr;
// 행/열의 갯수를 구함
row_count = grdList.getrowcount();
sub_row_count = grdList.getsubrowcount();
column_count = grdList.getcolumncount();
for (row = 0; row < row_count; row++) {
for (subrow = 0; subrow < sub_row_count; subrow++) {
row_data_arr = [];
for (column = 0; column < column_count; column++) {
// 한 행의 모든 컬럼 데이터를 배열에 추가
row_data_arr.push(grdList.getitemtext(row, subrow, column));
}
// 배열에 있는 데이터를 콤마를 구분하여 붙여서 콘솔에 출력
factory.consoleprint(row_data_arr.join(","));
}
}
}