guide:component:grid:grid_sort_sortapi [xFrame5 TechNet]

이 문서는 읽기 전용입니다. 원본을 볼 수는 있지만 바꿀 수는 없습니다. 문제가 있다고 생각하면 관리자에게 문의하세요.
====== 그리드 정렬 API 가이드 ======

그리드 정렬 API는 단일 컬럼 정렬, 멀티 컬럼 정렬, 정렬 상태를 처리하는 기능을 제공한다.

관련 API로 sort, multisort, multisortex, releasesort, getcolumnsortorder, getmultisort, getsortcolumns가 있다.

===== 예시 =====

템플릿 위치: /HTML5/COMPONENT/GRID/grid_sort_sortapi

템플릿 파일
  * [[xf5projecthome>template/screen/HTML5/COMPONENT/GRID/grid_sort_sortapi.xml|grid_sort_sortapi.xml]]
  * [[xf5projecthome>template/screen/HTML5/COMPONENT/GRID/grid_sort_sortapi.js|grid_sort_sortapi.js]]
  * [[xf5projecthome>template/template.html?xframe_screen_url=/HTML5/COMPONENT/GRID/grid_sort_sortapi|새창으로 실행]]

<php>
echo '<html>';
echo '<iframe src="';
echo $conf['plugin']['xf5']['xf5projecthome'], 'template/template.html?';
echo 'xframe_screen_url=/HTML5/COMPONENT/GRID/grid_sort_sortapi"';
echo ' class="_xf5_iframe"';
echo ' style="';
echo $conf['plugin']['xf5']['xf5iframestyle'];
echo '">';
echo '</iframe>';
echo '</html>';
</php>

==== 화면 스크립트 ====

<sxh javascript>
// 그리드 "on_sortcomplete" 이벤트
function grd_on_sortcomplete(objInst, nSortStartTime, nSortEndTime)
{
	var i, column_count, sort_order;

	// 컬럼의 정렬 상태를 구하여 헤더부에 표시
	column_count = this.grd.getcolumncount();
	for (i = 0; i < column_count; i++) {
		sort_order = this.grd.getcolumnsortorder(i);
		switch(sort_order) {
			case XFD_GRID_SORT_NONE:
				this.grd.setheadertext(1, i, "");
				break;
			case XFD_GRID_SORT_ASC:
				this.grd.setheadertext(1, i, "오름차순");
				break;
			case XFD_GRID_SORT_DES:
				this.grd.setheadertext(1, i, "내림차순");
				break;
		}
	}
}

// "sort" 버튼 이벤트
function btn_sort_on_click(objInst)
{
	this.grd.sort(this.cbo_column.val(), this.cbo_sortorder.val());
}

// "multisort" 버튼 이벤트
function btn_multisort_on_click(objInst)
{
	this.grd.multisort();
}

// "multisortex" 버튼 이벤트
function btn_multisortex_on_click(objInst)
{
	var sort_opt, sort_opt_arr = [];

	sort_opt_arr.push("0:" + this.cbo_sortorder0.val());
	sort_opt_arr.push("1:" + this.cbo_sortorder1.val());
	sort_opt_arr.push("2:" + this.cbo_sortorder2.val());

	// sort_opt 형식: "0:ASC,1:DESC,2:TOGGLE"
	sort_opt = sort_opt_arr.join(",");

	this.grd.multisortex(sort_opt, false);
}

// "releasesort" 버튼 이벤트
function btn_releasesort_on_click(objInst)
{
	this.grd.releasesort();
}

// "getsortcolumns" 버튼 이벤트
function btn_getsortcolumns_on_click(objInst)
{
	var sort_coilumn_index_arr = this.grd.getsortcolumns();
	screen.alert("정렬 컬럼 인덱스: " + sort_coilumn_index_arr.join(","));
}

// "getmultisort" 버튼 이벤트
function btn_getmultisort_on_click(objInst)
{
	var multi_sort = this.grd.getmultisort();
	screen.alert("정렬 상태: " + multi_sort);
}
</sxh>