그리드 컬럼 이동 가이드
그리드 컬럼 마우스로 드래드 이동 예시 화면이다.
그리드의 column_moveable 속성이 true인 경우에만 마우스 드래그 동작으로 컬럼을 이동할 수 있다.
그리드 movecolumn API를 통해서 컬럼을 이동할 수 있다.
예시
방법1. 그리드 헤더부를 드래그하여 이동하고자 하는 컬럼 헤더부에 드랍하여 컬럼을 이동한다.
방법2. 그리드 컬럼을 클릭하여 컬럼 선택 후, 우측에 있는 버튼을 클릭하여 컬럼을 이동한다.
템플릿 위치: /HTML5/COMPONENT/GRID/grid_column_move
템플릿 파일
화면 스크립트
// "선택된 컬럼 좌로 이동" 버튼 이벤트
function btn_movecolumnleft_on_mouseup(objInst)
{
var select_column_index;
// 선택된 컬럼 정보를 구함
select_column_index = this.grdList.getselectcolumn();
// 선택된 컬럼을 좌측으로 이동
this.grdList.movecolumn(select_column_index, select_column_index - 1);
}
// "선택된 컬럼 우로 이동" 버튼 이벤트
function btn_movecolumnright_on_mouseup(objInst)
{
var select_column_index, nColumnCount;
// 선택된 컬럼 정보를 구함
select_column_index = this.grdList.getselectcolumn();
// 선택된 컬럼을 우측으로 이동
this.grdList.movecolumn(select_column_index, select_column_index + 1);
}