====== 그리드 통계열 기본 가이드 ======
그리드 컴포넌트의 통계열에 대한 기본 기능 예시 화면이다.
통계열은 그리드 내부 데이터를 기준으로 그리드 컴포넌트에서 자동으로 통계 데이터를 계산하여 표시하는 기능을 제공한다.
관련 속성으로 statistics_column, statistics_column_show가 있다.
관련 API로 getstatcolumncount, getstatisticscoltext, getstatisticscolumnshow, setstatisticscolumnshow가 있다.
통계 데이터 계산 방식은 statistics_column 속성의 통계 유형(operation 속성)을 기준으로 계산된다.
===== 예시 =====
템플릿 위치: /HTML5/COMPONENT/GRID/grid_statcolumn_basic
템플릿 파일
* [[xf5projecthome>template/screen/HTML5/COMPONENT/GRID/grid_statcolumn_basic.xml|grid_statcolumn_basic.xml]]
* [[xf5projecthome>template/screen/HTML5/COMPONENT/GRID/grid_statcolumn_basic.js|grid_statcolumn_basic.js]]
* [[xf5projecthome>template/template.html?xframe_screen_url=/HTML5/COMPONENT/GRID/grid_statcolumn_basic|새창으로 실행]]
echo '';
echo '';
echo '';
==== 화면 스크립트 ====
// "getstatcolumncount" 버튼 이벤트
function btn_getstatcolumncount_on_mouseup(objInst)
{
// 행의 갯수를 구함
screen.alert("통계열 갯수: " + this.grdList.getstatcolumncount());
}
// "getstatisticscoltext" 버튼 이벤트
function btn_getstatisticscoltext_on_mouseup(objInst)
{
var row, column, row_count, stat_column_count, row_data_arr, column_data_arr;
// 통계행/열의 갯수를 구함
row_count = this.grdList.getrowcount();
stat_column_count = this.grdList.getstatcolumncount();
row_data_arr = [];
// 통계행 Loop
for (row = 0; row < row_count; row++) {
column_data_arr = [];
// 데이터 컬럼 Loop
for (column = 0; column < stat_column_count; column++) {
// 통계행 특정 아이템의 값을 구해서 통계행별 데이터 배열에 추가
column_data_arr.push(this.grdList.getstatisticscoltext(row, column));
}
// 배열에 있는 데이터를 콤마를 구분하여 붙여서 배열에 추가
row_data_arr.push(row + "행 데이터: " + column_data_arr.join(","));
}
screen.alert(row_data_arr.join("\n"));
}
// "getstatofstattext" 버튼 이벤트
function btn_getstatofstattext_on_mouseup(objInst)
{
var row, column, stat_row_count, stat_column_count, row_data_arr, column_data_arr;
// 통계행/열의 갯수를 구함
stat_row_count = this.grdList.getstatrowcount();
stat_column_count = this.grdList.getstatcolumncount();
row_data_arr = [];
// 통계행 Loop
for (row = 0; row < stat_row_count; row++) {
column_data_arr = [];
// 데이터 컬럼 Loop
for (column = 0; column < stat_column_count; column++) {
// 통계행 특정 아이템의 값을 구해서 통계행별 데이터 배열에 추가
column_data_arr.push(this.grdList.getstatofstattext(row, column));
}
// 배열에 있는 데이터를 콤마를 구분하여 붙여서 배열에 추가
row_data_arr.push(row + "행 데이터: " + column_data_arr.join(","));
}
screen.alert(row_data_arr.join("\n"));
}
// "setcolumnstatisticsshow" 버튼 이벤트
function btn_columnstatisticsshow_on_click(objInst)
{
var statistics_show;
// 그리드 2번째 컬럼 데이터부 statistics_show 속성 토글 처리
statistics_show = this.grdList.getcolumnstatisticsshow(2);
// statistics_show 값 토글 처리를 그리드에 설정
statistics_show = !statistics_show;
this.grdList.setcolumnstatisticsshow(2, statistics_show);
// statistics_show 값을 기준으로 헤더부 텍스트 변경
if (statistics_show) {
this.grdList.setheadertext(0, 2, "통계 포함");
}
else {
this.grdList.setheadertext(0, 2, "통계 제외");
}
}
// "setstatisticscolumnshow" 버튼 이벤트
function btn_setstatisticscolumnshow_on_mouseup(objInst)
{
// 그리드 statistics_row_show 속성 토글 처리
this.grdList.setstatisticscolumnshow(!this.grdList.getstatisticscolumnshow());
}