WebSquare.uiplugin.grid

grid 컴포넌트를 생성하고 옵션을 통해서 다양한 그리드 기능을 지원합니다.

Type

uiplugin

Property Summary

adaptive: 적응형 웹(다양한 화면크기와 디바이스에 맞게 레이아웃을 변경) 모드
adaptiveThreshold: adaptive가 설정되어 있을 경우 레이아웃 변경을 하기 위한 breakpoint(기본값 : 480)
autoFit: 여백이 없이 그리드를 그리는 옵션(lastColumn은 마지막 행만 allColumn은 모든 행의 너비를 조정)
autoFitMinWidth: autoFit의 값이 allColumn일 때 그리드 width의 최소 픽셀 값(lastColumn에는 적용되지 않음)
baseNode: 그리드 데이터 xml의 반복 node이전까지의 xpath
class: 그리드의 class
columnMove: 그리드 헤더를 마우스로 드래그하여 컬럼을 이동할 수 있는 기능의 동작 여부
dataDragDrop: 그리드 데이터의 드래그&드랍 사용 여부(FireFox에서는 Ctrl 키를 누르고 사용해야 됨)
disabledBackgroundColor: disabled 되어 있는 셀의 배경색
disabledFontColor: disabled 되어 있는 셀의 폰트색
dragDisplayColumn: 드래그 시 가져올 열 구분
dragEndFunction: 드래그 종료시 실행될 함수. dragStartFunction과 쌍으로 사용하며, drilldown인 경우와 아닌 경우 두가지로 구분해서 dragEndFunction을 정의해야 한다.
dragStartFunction: 드래그 시작시 실행될 함수. dragEndFunction과 쌍으로 사용하며, drilldown인 경우와 아닌 경우 두가지로 구분해서 dragStartFunction을 정의해야 한다.
editModeEvent: 수정모드로 변환하기 위한 이벤트
enterKeyMove: 엔터 입력시 포커스 이동방향에 대한 설정
escape: <>&"를 HTML Escape 문자로 변환하여 화면에 표시한다
evenRowBackgroundColor: 그리드 짝수 행 배경색
excludeDeletedRows: expression에서 deleted된 row를 제외합니다
fastScroll: 세로 스크롤이동시 빠르게 스크롤되는 효과를 허용하는 시간내에 그려진 부분까지만 렌더링하는 옵션
filterFocusMode: 그리드의 헤더 클릭을 통한 데이터 정렬 지원 여부
fixedColumn: 그리드의 컬럼 고정값
fixedColumnWithHidden: fixedColumn에 hiddenColumn 포함 여부
focusFlow: 그리드의 포커스 흐름을 선형 혹은 2차원(기본값)으로 설정하는 옵션
focusMode: 포커스시 표현 방법
focusMove: 그리드에서 키를 통한 포커스 이동을 허용할지 여부
footerCaption: grid footer의 caption
footerSummary: grid footer의 요약
hideHeader: 그리드 헤더 숨김 여부
id: 그리드의 id
keepDefaultColumnWidth: autoFit 시 그리드 행 번호 표시 컬럼, 행 상태 컬럼의 width 를 고정한다
keyMoveEditMode: 키를 통한 포커스 변경시 바로 수정모드로 변경여부
loadCount: onscrollend 발생 조건으로 사용되는 잔여 row 수
noResultMessage: 조회 결과가 없을 시 표시되는 메세지
noResultMessageClass: 그리드의 결과 없음 메시지의 class
noResultMessageStyle: 그리드의 결과 없음 메시지의 style
noResultMessageVisible: 조회 결과가 없을 시 메시지 표시 여부
oddEvenColorDisplay: 그리드 짝,홀수 행별 반복색 지정 여부
oddRowBackgroundColor: 그리드 홀수 행 배경색
overflowX: 그리드 좌우 스크롤 표시 여부
overflowY: 그리드 세로 스크롤 표시 여부
preventMultisort: [default:true, false] multisort 기능을 막을지 여부
readOnly: 그리드의 읽기 전용 여부
readOnlyBackgroundColor: 읽기 전용으로 지정된 셀의 배경색
readOnlyBackgroundImg: 읽기 전용으로 지정된 셀의 배경이미지
readOnlyBackgroundImgCSS: 읽기 전용으로 지정된 셀의 배경이미지 CSS를 직접입력
readOnlyPriority: 읽기 전용의 우선 순위
readOnlyTabIgnore: cell이 읽기 전용인 경우에 tab을 무시 여부
repeatNode: 그리드 데이터 xml의 반복 node xpath
resize: 헤더를 사용하여 커럼 폭 크기 조절 여부
rowMouseOver: 마우스 오버시 행 선택 표시 여부
rowMouseOverColor: 마우스 오버시 행의 배경색
rowNumBackgroundColor: 그리드 행 번호 배경 영역의 색상
rowNumHeaderValue: 그리드 행 번호 표시시 그리드 헤더에 표시할 텍스트
rowNumVisible: 그리드 행 번호 표시 여부
rowNumWidth: rowNum 컬럼의 width
rowStatusHeaderValue: 그리드 행 상태 표시시 그리드 헤더의 표시할 텍스트
rowStatusVisible: 그리드 행 상태 표시 여부
rowStatusWidth: rowStatus 컬럼의 width
scrollByColumn: 가로 스크롤시 컬럼 단위 이동
selectedCellColor: 선택된 셀의 배경색
selectedCellOverColor: 선택된 셀에 마우스 오버시 배경색(지정하지 않으면 rowMouseOverColor을 사용)
selectedRowColor: 선택된 행의 배경색
selectedRowOverColor: 선택된 행에 마우스 오버시 배경색(지정하지 않으면 rowMouseOverColor을 사용)
senseReader: 웹 접근성을 지원하기 위한 모드
showSortableImage: 그리드의 해당 컬럼이 정렬가능한 경우, 해당 컬럼의 헤더에 이미지를 출력할지에 대한 여부
sortable: 그리드의 헤더 클릭을 통한 데이터 정렬 지원 여부
sortEvent: 데이터 정렬을 위한 이벤트 설정
sortOrderReverse: 그리드의 헤더 클릭을 통한 데이터 정렬시 내림차순 정렬을 먼저 할지 여부
summary: 그리드 요약
tooltipDisplay: 그리드의 셀 크기보다 긴 데이터의 경우 툴팁 사용 여부
tooltipFormatter: tooltip의 내용(label)을 사용자 함수의 return값으로 표현하도록 하는 속성
tooltipPositionX: tooltip의 x좌표를 설정하는 옵션
tooltipPositionY: tooltip의 y좌표를 설정하는 옵션
tooltipShowAlways: tooltip을 텍스트 길이에 상관없이 마우스 오버 시 항상 보여줄지에 대한 여부
useCtrlKey: [default:true, false] ctrl키를 누르고 여러 개의 셀을 선택할지 여부
useCtrlOnMultisort: [default:true, false] 여러 개의 컬럼에 소팅을 하고자 할 때 ctrl키를 누르고 컬럼들을 선택할지 여부
userData1: 사용자 정의 데이터 속성
userData2: 사용자 정의 데이터 속성
userData3: 사용자 정의 데이터 속성
useShiftKey: shiftKey를 이용하여 복수의 셀 선택 여부
valueNode: 실제 데이터를 갖고 있는 attribute 이름, 빈 값의 경우 텍스트 노드에 셀 데이터를 갖음
visibleRowNum: 표시 항목행수
wheelRows: 세로 휠 이동시 한번 이동하는 행의 개수
wheelStop: [default:false] 그리드 스크롤이 맨 아래로 내려갔을 때 wheel을 한 경우 브라우저 스크롤을 막을지에 대한 여부

Event Summary

onafteredit: 셀의 수정이 끝나서 포커스가 빠져나온 경우 발생하며, oneditend후에 발생
onbeforeedit: 셀 수정모드로 들어가기 전에 발생
onbodymouseover: 그리드의 body에 마우스가 오버된 경우 발생
oncellclick: 셀이 클릭된 경우 발생
oncelldblclick: 셀이 더블 클릭된 경우 발생
oncellindexchange: 셀 선택(방항키, 마우스)하여 셀의 인덱스가 바뀐 경우 발생
onchange: 셀의 데이터가 바뀐경우 발생
oncolumnindexchange: 셀 선택(방항키, 마우스)하여 열의 인덱스가 바뀐 경우 발생
oneditend: 셀의 에디트가 끝난 경우 발생하며, onafteredit보다 먼저 발생
oneditkeydown: 셀의 에디트시 키를 누른 경우 발생하며, opera와 firefox에서 2byte짜리 문자(한글)를 입력할 때는 첫 입력시 또는 문자 조합이 완료된 후에만 발생한다
onfilereadend: 엑셀업로드가 끝난 경우 발생
onfooterclick: footer가 클릭된 경우 발생
onheaderclick: header가 클릭된 경우 발생
onrightbuttonclick: 마우스 오른쪽 버튼이 클릭된 경우 발생
onrowindexchange: 셀 선택(방항키, 마우스)하여 행의 인덱스가 바뀐 경우 발생
onscrollend: 세로 스크롤이 loadcount 만큼 행을 남긴 경우 발생
onscrollx: 가로 스크롤을 움직이는 경우 발생
onscrolly: 세로 스크롤을 움직이는 경우 발생
onsort: sortable 속성이 적용된 헤더에서 클릭이나 더블클릭을 통하여 정렬방식이 변경되었을 경우 발생
ontextimageclick: inputType 이 textImage 인 경우 image가 클릭 된 경우 발생
onviewchange: 셀의 데이터가 키보드나 마우스 조작을 통해 변경된 경우에만 발생하는 이벤트

Method Summary

addClass( className ): 컴포넌트에 class를 추가한다
advancedExcelDownload( options , infoArr ): 그리드의 데이터를 엑셀 파일로 저장합니다
advancedExcelUpload( options ): 엑셀 파일을 읽어 그리드의 데이터를 설정합니다
bind( eventType , function ): 컴포넌트의 이벤트를 동적으로 할당한다
changeClass( oldClassName , newClassName ): 컴포넌트에서 oldClassName의 이름을 가진 class를 newClassName으로 변경한다.
checkAll( colIndex , dataValue ): 체크 박스로 이루어진 열을 한번에 체크하거나 언체크합니다
clearGroupby( ): grid groupby를 해제합니다
clearSort( ): 그리드의 모든 정렬을 취소해줍니다
deleteRow( rowIndex ): rowInex에 해당하는 행의 상태 값을 삭제로 바꿔줍니다
focus( ): 컴포넌트에 focus를 준다
getAllData( ): 그리드의 모든 data를 배열로 반환합니다
getAllDisplayData( ): 그리드의 화면에 보이는 data를 배열로 반환합니다
getAllDisplayXML( ): 그리드의 모든 data를 XML로 반환합니다
getAllFocusedIndex( ): 포커스가 위치한 모든 셀의 rowIndex와 colIndex를 반환합니다
getAllVisibleData( ): 그리드의 현재 보이는 data를 배열로 반환합니다
getAllVisibleXML( ): 그리드의 현재 보이는 data를 XML로 반환합니다
getAllXML( ): 그리드의 모든 data를 XML로 반환합니다
getBottomRowIndex( ): 현재 그리드에 그려진 최하단 row의 rowIndex를 반환합니다
getCellBackgroundColor( rowIndex , colIndex ): rowIndex와 colIndex에 해당하는 셀의 배경색을 반환합니다
getCellChecked( rowIndex , colIndex ): rowIndex와 colIndex로 해당하는 셀의 check여부를 반환합니다
getCellColor( rowIndex , colIndex ): rowIndex와 colIndex에 해당하는 셀의 글자색을 반환합니다
getCellData( rowIndex , colIndex ): rowIndex와 colIndex에 해당하는 셀의 데이터를 반환합니다
getCellDisabled( rowIndex , colIndex ): colIndex와 rowIndex 해당하는 셀의 disabled속성 값을 반환합니다
getCellDisplayData( rowIndex , colIndex ): rowIndex와 colIndex에 해당하는 셀의 화면에 보이는 데이터를 반환합니다
getCellPosition( row , colIndex , propertyName ): 셀의 위치 정보(top이나 left)를 반환합니다
getCellReadOnly( rowIndex , colIndex ): colIndex와 rowIndex에 해당하는 셀의 readonly속성 값을 반환합니다
getCellSize( row , colIndex , sizeName ): 셀의 크기 정보(width나 height)를 반환합니다
getCheckedData( colIndex ): colIndex에 해당하는 열이 radio/checkbox일 경우 check된 행의 data를 배열로 반환합니다
getCheckedIndex( colIndex ): colIndex에 해당하는 열의 radio/checkbox가 check된 행의 Index를 배열로 반환합니다
getCheckedXML( colIndex ): colIndex에 해당하는 열이 radio/checkbox일 경우 check된 행의 data를 XML로 반환합니다
getChildrenRowIndexArray( rowIndex ): drilldown 사용시 rowIndex에 해당하는 행의 자식 행들의 rowIndex를 배열로 반환합니다
getColData( colIndex ): colIndex에 해당하는 열의 데이터(filter나 sort처리되지 않은)를 배열로 반환합니다
getColIdByHeaderId( headerId ): sort에서 주어진 headerId에 해당하는 header를 클릭했을때 참조하는 body의 columnId를 반환한다
getColumnBackgroundColor( colIndex ): colIndex에 해당하는 열의 배경색을 반환합니다
getColumnColor( colIndex ): colIndex에 해당하는 열의 글자색을 반환합니다
getColumnDisabled( colIndex ): colIndex에 해당하는 열에 disabled속성 값을 반환합니다
getColumnDistinctDataArray( colIndex ): 해당 colIndex에 존재하는 중복된 항목을 제거한 data를 배열을 정렬하여 보여줍니다
getColumnID( colIndex ): 그리드의 컬럼 index를 입력받아 그에 해당하는 컬럼의 id를 반환합니다
getColumnIndex( colIndex ): 그리드의 컬럼 id를 입력받아 그에 해당하는 컬럼의 index를 반환합니다
getColumnOrder( byName ): 현재 그리드의 컬럼 순서를 배열로 반환합니다
getColumnReadOnly( colIndex ): colIndex에 해당하는 열에 적용된 readonly속성 값을 반환합니다
getColumnType( colIndex ): colIndex에 해당하는 열의 inputType 속성값을 반환합니다
getColumnVisible( colIndex ): colIndex에 해당하는 열의 visible여부를 반환합니다
getDataLength( ): 현재 화면에 보이는 행의 수를 반환합니다
getDataRow( rowIndex ): rowIndex에 해당하는 행의 데이터를 컬럼의 아이디를 키로 하는 해쉬 형태로 반환합니다
getDeletedData( ): 삭제 상태인 행들을 배열로 반환합니다
getDeletedIndex( ): 삭제 상태인 행의 번호를 배열로 반환합니다
getDeletedXML( ): 삭제 상태인 행들의 데이터를 XML로 반환합니다
getDisabled( type , rowIndex , colIndex ): type에 따라 disabled 속성을 반환합니다
getFocusedColumnID( ): 포커스가 위치한 셀이 속한 column의 ID를 반환합니다
getFocusedColumnIndex( ): 포커스가 위치한 셀의 colIndex를 반환합니다
getFocusedRowIndex( ): 포커스가 위치한 셀의 rowIndex를 반환합니다
getFocusedRowStatus( ): 포커스가 위치한 셀이 속한 row의 상태 값(문자)를 반환합니다
getFooterData( footerId , display ): footerId에 해당하는 footer의 값을 반환합니다
getFooterStyle( footerId , style ): 그리드의 footerId에 해당하는 footer의 스타일 속성값을 가져옵니다
getGridReadOnly( ): 그리드의 읽기 전용 속성을 반환합니다
getHeaderBackgroundColor( headerId ): 그리드의 헤더 셀에 적용된 배경색 값을 가져옵니다
getHeaderColor( headerId ): 그리드의 헤더 셀에 적용된 글씨 색상값을 가져옵니다
getHeaderID( header ): header index로 header id를 찾아옵니다
getHeaderIndex( header ): header id로 header index를 찾아옵니다
getHeaderPosition( headerId , propertyName ): header의 위치 정보(top이나 left)를 반환합니다
getHeaderSize( headerId , sizeName ): header의 크기 정보(width나 height)를 반환합니다
getHeaderValue( headerId ): 헤더의 값을 반환합니다
getID( ): 웹스퀘어 컴포넌트의 id를 반환한다
getInsertedData( ): 삽입 상태인 행들의 데이터를 배열로 반환합니다
getInsertedIndex( ): 삽입 상태인 행의 번호를 배열로 반환합니다
getInsertedXML( ): 삽입 상태인 행들의 데이터를 XML로 반환합니다
getMatchedColumnData( matchCol , dataValue , targetCol , exactMatch , stRowIndex , lastRowIndex ): stRowIndex부터 lastRowIndex-1 까지의 범위의 행중에서 colIndex의 값이 dataValue와 같은 행들을 찾아서 targetCol에 해당하는 열의 값들을 배열로 반환합니다
getMatchedData( colIndex , dataValue , exactMatch , stRowIndex , lastRowIndex ): stRowIndex부터 lastRowIndex-1 까지의 범위의 행중에서 colIndex의 값이 dataValue와 같은 행들의 data를 배열로 반환합니다
getMatchedIndex( colIndex , dataValue , exactMatch , stRowIndex , lastRowIndex ): stRowIndex부터 lastRowIndex-1 까지의 범위의 행중에서 colIndex의 값이 dataValue와 같은 행들의 index를 반환합니다
getMatchedXML( colIndex , dataValue , exactMatch , stRowIndex , lastRowIndex ): stRowIndex부터 lastRowIndex까지의 범위의 행중에서 colIndex의 값이 dataValue와 같은 행들의 data를 XML로 반환합니다
getModifiedData( ): 변경(삽입, 갱신, 삭제) 행들의 데이터를 배열로 반환합니다
getModifiedIndex( ): 추가나 삭제 상태인 행의 번호를 배열로 반환합니다
getModifiedXML( ): 변경(삽입, 갱신, 삭제) 행들의 데이터를 XML로 반환합니다
getOpacity( ): CSS로 정의 된 컴포넌트의 Opacity(불투명도) 값을 반환한다
getOpenStatus( rowIndex ): rowIndex에 해당하는 행의 drilldown이 열려있는지 닫혀있는지 여부를 boolean으로 반환합니다
getOriginalCellData( rowIndex , colIndex ): rowIndex와 colIndex에 해당하는 셀의 데이터를 반환합니다
getOverflowX( ): 그리드의 overflowX의 설정을 반환합니다
getOverflowY( ): 그리드의 overflowY의 설정을 반환합니다
getPluginName( ): 웹스퀘어 컴포넌트의 pluginName(컴포넌트명)을 반환한다
getPosition( positionName ): 컴포넌트의 left 또는 top의 위치 값을 반환한다
getRangeData( from , to ): from부터 to-1 까지의 범위의 행의 data를 배열로 반환합니다
getRangeXML( from , to ): from부터 to-1 까지의 범위의 행의 data를 xml로 반환합니다
getReadOnly( type , rowIndex , colIndex ): type에 따라 readOnly 속성을 반환합니다
getRealRowIndex( rowIndex ): rowIndex에 대한 실제 데이터의 rowIndex를 리턴한다
getRowBackgroundColor( rowIndex ): rowIndex에 해당하는 행의 배경색을 반환합니다
getRowColor( rowIndex ): rowIndex에 해당하는 행의 글자색을 반환합니다
getRowCount( ): 그리드의 데이터 row의 건수를 반환합니다
getRowData( rowIndex , display ): rowIndex에 해당하는 행의 데이터를 배열로 반환합니다
getRowDisabled( rowIndex ): rowIndex에 해당하는 행에 적용된 disabled속성 값을 반환합니다
getRowIndexByStatus( statusStr ): statusStr과 상태가 일치하는 행의 번호를 배열로 반환합니다
getRowReadOnly( rowIndex ): rowIndex에 해당하는 행에 적용된 readonly속성 값을 반환합니다
getRowStatus( rowIndex ): rowIndex에 해당하는 행의 상태를 반환합니다
getRowStatusValue( rowIndex ): rowIndex에 해당하는 행의 상태를 숫자로 반환합니다
getRowXML( rowIndex ): rowIndex에 해당하는 행의 data를 XML로 반환합니다
getSize( sizeName ): 컴포넌트의 크기 값을 반환합니다
getSortableArr( ): header의 각 컬럼이 sortable한지 여부를 array로 반환한다
getSortableStatus( ): sorting된 컬럼의 순서대로 해당 컬럼의 header 정보를 담은 object를 array로 반환한다. sorting된 컬럼이 없을 경우 빈 array를 반환한다.
getStyle( propertyName ): 컴포넌트에 적용 된 CSS의 propertyName에 해당하는 값을 반환한다
getStyleValue( style ): [deprecated]getStyle로 사용.
getTitle( ): title 속성값을 반환한다
getTopRowIndex( ): 현재 그리드에 그려진 최상단 row의 rowIndex를 반환합니다
getTotalCol( ): 컬럼의 개수를 반환 한다
getTotalRow( ): 행의 개수를 반환 한다
getUncheckedData( colIndex ): colIndex에 해당하는 열이 radio/checkbox일 경우 uncheck된 행의 data를 XML로 반환합니다
getUncheckedIndex( colIndex ): colIndex에 해당하는 열의 radio/checkbox가 uncheck된 행의 Index를 배열로 반환합니다
getUncheckedXML( colIndex ): colIndex에 해당하는 열의 radio/checkbox가 uncheck된 행의 data를 XML로 반환합니다
getUnmatchedColumnData( matchCol , dataValue , targetCol , exactMatch , stRowIndex , lastRowIndex ): stRowIndex부터 lastRowIndex-1 까지의 범위의 행중에서 colIndex의 값이 dataValue와 다른 행들을 찾아서 targetCol에 해당하는 열의 값들을 배열로 반환합니다
getUnmatchedData( colIndex , dataValue , exactMatch , stRowIndex , lastRowIndex ): stRowIndex부터 lastRowIndex-1 까지의 범위의 행중에서 colIndex의 값이 dataValue와 다른 행들의 data를 배열로 반환합니다
getUnmatchedIndex( colIndex , dataValue , exactMatch , stRowIndex , lastRowIndex ): stRowIndex부터 lastRowIndex-1 까지의 범위의 행중에서 colIndex의 값이 dataValue와 다른 행들의 index를 배열로 반환합니다
getUnmatchedXML( colIndex , dataValue , exactMatch , stRowIndex , lastRowIndex ): stRowIndex부터 lastRowIndex-1 까지의 범위의 행중에서 colIndex의 값이 dataValue와 다른 행들의 data를 Xml로 반환합니다
getUpdatedData( ): 갱신 상태인 행들의 데이터를 배열로 반환합니다
getUpdatedIndex( ): 갱신 상태인 행의 번호를 배열로 반환합니다
getUpdatedXML( ): 갱신 상태인 행들의 데이터를 XML로 반환합니다
getUserData( key ): setUserData API로 설정 된 사용자 데이터 또는 소스(화면 XML)에 사용자가 임의의 property로 정의 된 값을 반환한다
getVisibleColData( colIndex ): colIndex에 해당하는 열의 화면에 보이는(filter나 sort처리된) 데이터를 배열로 반환합니다
getVisibleRowNum( ): 현재 그리드에 그려진 row의 수를 반환합니다
hasClass( className ): 컴포넌트가 parameter로 받은 className의 class를 가지고 있는지의 여부를 반환한다
hide( ): 컴포넌트를 화면에서 보이지 않도록 숨긴다.
initGrid( ): 실행중인 그리드를 초기화 합니다
insertRow( rowIndex ): rowIndex에 해당하는 행에 새로운 행을 삽입합니다
isEditing( ): 그리드가 현재 편집중 인지 여부를 반환합니다
modifyAllStatus( status ): 모든 행의 상태를 status으로 변경 합니다
modifyCheckedStatus( col , status ): col에 해당하는 열의 checkbox가 check된 행의 상태를 상태로 변경합니다
modifyMatchedStatus( colIndex , data , status ): col에 해당하는 열의 값과 data가 일치된 행의 상태를 status로 변경합니다
modifyRangeStatus( from , to , status ): from부터 to까지의 범위의 행들의 상태를 param으로 입력받은 상태로 변경 합니다
modifyRowStatus( rowIndex , status ): rowIndex에 해당하는 행의 상태를 param으로 입력받은 상태로 변경 합니다
modifyUncheckStatus( col , status ): col에 해당하는 열의 checkbox가 uncheck된 행의 상태를 status로 변경합니다
multisort( options ): option에 따라서 여러개의 열을 동시에 정렬해줍니다
readCSV( options ): csv 파일을 읽어 그리드의 데이터를 설정합니다
redrawColumn( colIndex , valid ): colIndex에 해당하는 열을 다시 그려줍니다
reform( ): 그리드의 originalData를 현재의 데이터로 바꿔주고 모든 행의 상태를 초기화합니다
refreshColumnItemset( colIndex ): colIndex에 해당하는 열의 itemset을 갱신합니다
removeAll( ): 그리드의 모든 행을 삭제하고 가지고 있던 data를 반환합니다
removeClass( className ): 컴포넌트에 className의 class를 삭제한다.
removeColumnFilter( colIndex ): colIndex에 해당하는 열에 적용된 filter를 삭제합니다
removeColumnFilterAll( ): 모든 열에 적용된 filter를 삭제합니다
removeFocusedCell( ): 그리드의 셀에 지정되어 있는 모든 포커스를 제거한다
removeRange( startIdx , endIdx ): startIdx와 endIdx사이의 그리드의 모든 행을 삭제하고 가지고 있던 data를 반환합니다
removeRow( rowIndex ): rowIndex에 해당하는 행을 삭제하고 가지고 있던 data를 반환합니다
removeRows( rowIndexArr ): rowIndexArr배열에 저장된 index에 해당하는 행들을 삭제하고 가지고 있던 data들을 반환합니다
rowMoveDown( rowIndex ): rowIndex에 해당하는 행을 하나 아래로 내려줍니다
rowMoveUp( rowIndex ): rowIndex에 해당하는 행을 하나 위로 올려줍니다
saveCSV( options ): 그리드의 데이터를 CSV 파일로 저장합니다
setAutoFit( options ): 그리드의 사이즈에 맞게 컬럼의 크기를 변경하여 꽉차게 그려줍니다
setBottomRowIndex( bottomRowIndex ): 그리드의 세로 스크롤 위치를 이동하여 최하단에 bottomRowIndex 해당하는 row가 위치하도록 조정합니다
setCaption( htmlStr ): 그리드 테이블의 caption의 innerHTML 값을 설정합니다
setCellBackgroundColor( rowIndex , colIndex , color ): rowIndex와 colIndex에 해당하는 셀에 param으로 들어온 color를 배경색으로 설정합니다
setCellChecked( rowIndex , colIndex , dataValue ): rowIndex와 colIndex에 해당하는 셀이 checkbox/radio인 경우 dataValue가 true이면 체크 false이면 uncheck해 줍니다
setCellColor( rowIndex , colIndex , color ): rowIndex와 colIndex에 해당하는 셀에 param으로 들어온 color를 글자색으로 설정합니다
setCellData( rowIndex , colIndex , data ): rowIndex와 colIndex에 해당하는 셀의 값을 data로 바꿔줍니다
setCellDisabled( rowIndex , colIndex , disabled ): colIndex와 rowIndex에 해당하는 셀의 disabled속성 값을 param으로 들어온 disabled값으로 설정합니다
setCellReadOnly( rowIndex , colIndex , readOnly ): colIndex와 rowIndex에 해당하는 셀의 readonly속성 값을 param으로 들어온 readOnly값으로 설정합니다
setColumnBackgroundColor( colIndex , color ): colIndex에 해당하는 열에 param으로 들어온 color를 배경색으로 설정합니다
setColumnColor( colIndex , color ): colIndex에 해당하는 행에 param으로 들어온 color를 글자색으로 설정합니다
setColumnDisabled( colIndex , disabled ): colIndex에 해당하는 열에 disabled속성을 param으로 들어온 disabled로 설정합니다
setColumnFilter( filterOptions ): colIndex에 해당하는 열에 filter를 적용합니다
setColumnOrder( columnOrderArray ): 주어진 array를 기준으로 하여 그리드의 컬럼 순서를 재 설정합니다
setColumnReadOnly( colIndex , readOnly ): colIndex에 해당하는 열에 readonly속성을 param으로 들어온 readonly로 설정합니다
setColumnVisible( colIndex , colVisible ): 주어진 column의 hidden 여부를 설정한다
setColumnWidth( colIndex , size ): 지정한 컬럼의 폭을 변경합니다
setData( arr , append , columnArr ): 1차원 Array형태의 String를 Grid에 추가합니다
setDisabled( type , rowIndex , colIndex , disabled ): 해당하는 type의 disabled 속성 값을 param으로 들어온 disabled값으로 설정합니다
setDisplayFormat( colIndex , displayFormat ): 그리드의 컬럼에 포맷을 설정합니다
setDisplayFormatter( colIndex , displayFormatter ): 그리드의 컬럼에 포맷터 함수를 설정합니다
setEventPause( evList , flag ): 컴포넌트의 이벤트를 disable 또는 enable시킨다
setFixedColumn( fixedColumn ): 고정된 컬럼 영역을 설정합니다
setFocusedCell( rowIndex , colIndex , editMode ): 그리드의 특정 셀로 포커스를 이동한다
setFocusedHeaderObj( headerId ): 그리드 헤더가 가진 object로 포커스를 이동한다
setFooterCaption( htmlStr ): 그리드 footer 테이블의 caption의 innerHTML 값을 설정합니다
setFooterData( footerId , data ): footerId에 해당하는 footer의 inputType이 text인 경우에 data의 값을 footer에 넣어줍니다
setFooterDisplayFormat( footerId , displayFormat ): 그리드의 footerId에 해당하는 footer의 포맷을 설정합니다
setFooterStyle( footerId , style , value ): 그리드의 footerId에 해당하는 footer cell의 스타일 속성을 설정합니다
setFooterValue( footerId , data ): footerId에 해당하는 footer의 inputType이 text인 경우에 data의 값을 footer에 넣어줍니다
setGridHeight( height ): 그리드의 높이를 설정합니다
setGridReadOnly( readOnly ): 그리드의 읽기 전용 속성을 설정합니다
setGridSize( width , height ): 그리드의 높이와 폭을 설정합니다
setGridWidth( width ): 그리드의 폭을 설정합니다
setHeaderBackgroundColor( headerId , color ): 그리드의 헤더 셀의 배경 색상을 지정합니다
setHeaderColor( headerId , color ): 그리드의 헤더 셀의 글씨 색상을 지정합니다
setHeaderDisabled( headerId , disabled ): disabled가 true이면 headerId에 해당하는 헤더를 disalbled시켜줍니다
setHeaderHide( hide ): hide가 true이면 header를 숨기고 false이면 나타나도록 합니다
setHeaderNodeSet( headerId , nodeset , label , value ): headInputType이 select일 경우, headerId에 해당 하는 header 컬럼 selectbox itemset의 Model 바인딩 ref를 셋팅합니다
setHeaderSortImage( headerId , order , sortOrd ): header에 나타나는 sort 이미지를 조절한다
setHeaderStyle( headerId , style , value ): 그리드의 headerId에 해당하는 header cell의 스타일 속성을 설정합니다
setHeaderValue( headerId , value ): headerId에 해당 하는 header 컬럼의 value를 설정 합니다
setJSON( jsonData , append ): JSON Data를 Grid에 넣거나 추가합니다
setNoResultMessage( message ): 데이터 없음을 표시하기한 문자열을 설정합니다
setOpacity( value ): 컴포넌트의 CSS Opacity(불투명도)값를 설정한다
setPosition( left , top , mode ): 컴포넌트의 위치(left,top)를 설정한다
setReadOnly( type , rowIndex , colIndex , readOnly ): 해당하는 type의 readOnly 속성 값을 param으로 들어온 readOnly값으로 설정합니다
setRowBackgroundColor( rowIndex , color ): rowIndex에 해당하는 행에 param으로 들어온 color를 배경색으로 설정합니다
setRowColor( rowIndex , color ): rowIndex에 해당하는 행에 param으로 들어온 color를 글자색으로 설정합니다
setRowData( rowIndex , rowData , overwrite ): rowIndex에 해당하는 행에 rowData를 넣어줍니다
setRowDisabled( rowIndex , disabled ): colIndex에 해당하는 행의 disabled속성을 param으로 들어온 disabled로 설정합니다
setRowNumColumnWidth( size ): rowNum컬럼의 폭을 변경합니다
setRowReadOnly( rowIndex , readOnly ): rowIndex에 해당하는 행의 readonly속성을 param으로 들어온 readonly로 설정합니다
setRowStatusColumnWidth( size ): rowStatus컬럼의 폭을 변경합니다
setRowXML( rowIndex , rowData , overwrite ): rowIndex에 해당하는 행에 rowData를 넣어줍니다
setSize( width , heigth ): 컴포넌트의 크기(width,height)를 설정한다
setStartRowNumber( startRowNumber ): startRowNumber에 해당하는 인덱스를 행번호의 시작점으로 설정합니다
setStyle( propertyName , value ): 컴포넌트의 property별 style을 설정한다
setSummary( str ): 그리드 테이블의 summary 값을 설정합니다
setTopRowIndex( topRowIndex ): 그리드의 세로 스크롤 위치를 이동하여 최상단에 topRowIndex에 해당하는 row가 위치하도록 조정합니다
setUserData( key , value ): 컴포넌트에 사용자 데이터를 설정한다
setXML( element , append ): XML[xml데이터]을 Grid에 넣거나 추가합니다
show( displayType ): 컴포넌트를 화면에 보이도록 설정한다.
sort( bodyColumnID , sortType ): bodyColumnID에 해당하는 열을 정렬해줍니다
spanAll( openFlag ): drilldown을 사용하는 grid에서 전체 데이터를 모두 펼치거나 모두 접는다
toggleClass( className ): 컴포넌트가 className의 이름을 가진 class를 가지고 있다면 제거하고, 가지고 있지 않다면 추가한다.
trigger( type , array ): 컴포넌트에 등록 된 특정 이벤트를 발생시킨다
unbind( type , function ): 컴포넌트에 등록 된 이벤트를 제거한다
undeleteRow( rowIndex ): rowInex에 해당하는 행이 삭제 상태를 취소합니다
undoAll( ): 갱신이나 삭제된 행들의 data를 처음 입력된 데이터로 바꿔주고 행의 상태를 초기화 시켜줍니다
undoRow( rowIndex ): rowIndex에 해당하는 row의 data를 수정되기전 data로 바꿔주고 행의 상태를 복구합니다
visible( flag ): [deprecated]show/hide 로 사용하거나 setStyle을 통해 visible 속성을 설정한다.

Property Detail

adaptive: 적응형 웹(다양한 화면크기와 디바이스에 맞게 레이아웃을 변경) 모드
adaptiveThreshold: adaptive가 설정되어 있을 경우 레이아웃 변경을 하기 위한 breakpoint(기본값 : 480)
autoFit: 여백이 없이 그리드를 그리는 옵션(lastColumn은 마지막 행만 allColumn은 모든 행의 너비를 조정)
autoFitMinWidth: autoFit의 값이 allColumn일 때 그리드 width의 최소 픽셀 값(lastColumn에는 적용되지 않음)
baseNode: 그리드 데이터 xml의 반복 node이전까지의 xpath
class: 그리드의 class
columnMove: 그리드 헤더를 마우스로 드래그하여 컬럼을 이동할 수 있는 기능의 동작 여부
dataDragDrop: 그리드 데이터의 드래그&드랍 사용 여부(FireFox에서는 Ctrl 키를 누르고 사용해야 됨)
disabledBackgroundColor: disabled 되어 있는 셀의 배경색
disabledFontColor: disabled 되어 있는 셀의 폰트색
dragDisplayColumn: 드래그 시 가져올 열 구분
dragEndFunction: 드래그 종료시 실행될 함수. dragStartFunction과 쌍으로 사용하며, drilldown인 경우와 아닌 경우 두가지로 구분해서 dragEndFunction을 정의해야 한다.
1) 기본적으로 dragEndFunction을 정의할 때, targetRowIndex, rowXml, infoObj가 각각 첫번째, 두번째, 세번째 인자로 넘어온다. 두번째 인자인 rowXml은 dragStartFunction에서 리턴한 값이며, 세번째 인자인 infoObj는 object이며 fromColumnId, fromColumnIndex, toColumnId, toColumnIndex 정보를 포함하고 있다.
dragEndFunction에서 targetRowIndex에 삽입하고자 하는 row를 삽입하는 로직을 구현하면 되며, 리턴값이 true일 때 처음 dragdrop이 시작됐던 rowIndex에 해당하는 row를 삭제한다.
function end( targetRowIndex, rowXml, info ) {
var fromColumnId = info.fromColumnId;
var fromColumnIndex = info.fromColumnIndex;
var toColumnId = info.toColumnId;
var toColumnIndex = info.toColumnIndex;
.
.
.
return true; // true인 경우만 처음 dragdrop이 시작됐던 rowIndex에 해당하는 row를 삭제한다.
}
2) 그리드가 drilldown을 사용하는 경우 setDrillDownDragDrop 함수의 첫번째 인자값으로 true를 줘야 하며, 이 경우 dragStartFunction은 toIndex, rowXml, infoObj가 각각 첫번째, 두번째, 세번째 인자로 넘어온다.
첫번째 인자값으로는 toIndex가 주어지는데 drilldown을 사용하였기 때문에 targetIndex의 realRowIndex를 계산한 값이라고 보면 된다.
세번째 인자값으로 object가 주어지며 removedData, removedRowIndex, insertedData, insertedRowIndex, fromRowIndex, toRowIndex 정보를 포함하고 있다. 위의 경우와 달리 리턴값은 아무 의미 없다.
function end( toIndex, rowXml, info ) {
var removedData = info.removedData;
var removedRowIndex = info.removedRowIndex;
var insertedData = info.insertedData;
var insertedRowIndex = info.insertedRowIndex;
var fromRowIndex = info.fromRowIndex;
var toRowIndex = info.toRowIndex;
.
.
.
}
dragStartFunction: 드래그 시작시 실행될 함수. dragEndFunction과 쌍으로 사용하며, drilldown인 경우와 아닌 경우 두가지로 구분해서 dragStartFunction을 정의해야 한다.
1) 기본적으로 dragStartFunction을 정의할 때, rowIndex, rowXml, infoObj가 각각 첫번째, 두번째, 세번째 인자로 넘어온다. 세번째 인자인 infoObj는 object이며 fromColumnId, fromColumnIndex 정보를 포함하고 있다.
리턴값은 dragEndFunction이 정의되어 있는 경우 dragEndFunction이 실행될 때 두번째 인자로 이용할 수 있다.
function start( rowIndex, rowXml, info ) {
var fromColumnId = info.fromColumnId;
var fromColumnIndex = info.fromColumnIndex;
.
.
.
return rowXml; // dragEndFunction의 두번째 인자로 이용됨.
}
2) 그리드가 drilldown을 사용하는 경우 setDrillDownDragDrop 함수의 첫번째 인자값으로 true를 주고 실행시킨 이후의 상태여야 하며, dragStartFunction을 실행했을 때는 return값이 true인 경우에만 drilldown dragDrop을 실행한다.
이 경우 dragStartFunction은 첫번째 인자값으로 object가 주어지며 parentRowIndex, parentRowData, beforeRemoveRowIndex, beforeRemveData 정보를 포함하고 있다.
function start( info ) {
var parentRowIndex = info.parentRowIndex;
var parentRowData = info.parentRowData;
var beforeRemoveRowIndex = info.beforeRemoveRowIndex;
var beforeRemoveData = info.beforeRemoveData;
.
.
.
return true; // true인 경우에만 drilldown dragDrop을 실행한다.
}
editModeEvent: 수정모드로 변환하기 위한 이벤트
enterKeyMove: 엔터 입력시 포커스 이동방향에 대한 설정
escape: <>&"를 HTML Escape 문자로 변환하여 화면에 표시한다.
evenRowBackgroundColor: 그리드 짝수 행 배경색
excludeDeletedRows: expression에서 deleted된 row를 제외합니다.
fastScroll: 세로 스크롤이동시 빠르게 스크롤되는 효과를 허용하는 시간내에 그려진 부분까지만 렌더링하는 옵션
filterFocusMode: 그리드의 헤더 클릭을 통한 데이터 정렬 지원 여부
fixedColumn: 그리드의 컬럼 고정값
fixedColumnWithHidden: fixedColumn에 hiddenColumn 포함 여부
focusFlow: 그리드의 포커스 흐름을 선형 혹은 2차원(기본값)으로 설정하는 옵션
focusMode: 포커스시 표현 방법.
focusMove: 그리드에서 키를 통한 포커스 이동을 허용할지 여부
footerCaption: grid footer의 caption
footerSummary: grid footer의 요약
hideHeader: 그리드 헤더 숨김 여부
id: 그리드의 id
keepDefaultColumnWidth: autoFit 시 그리드 행 번호 표시 컬럼, 행 상태 컬럼의 width 를 고정한다.
keyMoveEditMode: 키를 통한 포커스 변경시 바로 수정모드로 변경여부
loadCount: onscrollend 발생 조건으로 사용되는 잔여 row 수
noResultMessage: 조회 결과가 없을 시 표시되는 메세지
noResultMessageClass: 그리드의 결과 없음 메시지의 class
noResultMessageStyle: 그리드의 결과 없음 메시지의 style
noResultMessageVisible: 조회 결과가 없을 시 메시지 표시 여부
oddEvenColorDisplay: 그리드 짝,홀수 행별 반복색 지정 여부
oddRowBackgroundColor: 그리드 홀수 행 배경색
overflowX: 그리드 좌우 스크롤 표시 여부
overflowY: 그리드 세로 스크롤 표시 여부
preventMultisort: [default:true, false] multisort 기능을 막을지 여부.
readOnly: 그리드의 읽기 전용 여부
readOnlyBackgroundColor: 읽기 전용으로 지정된 셀의 배경색
readOnlyBackgroundImg: 읽기 전용으로 지정된 셀의 배경이미지
readOnlyBackgroundImgCSS: 읽기 전용으로 지정된 셀의 배경이미지 CSS를 직접입력
readOnlyPriority: 읽기 전용의 우선 순위
readOnlyTabIgnore: cell이 읽기 전용인 경우에 tab을 무시 여부
repeatNode: 그리드 데이터 xml의 반복 node xpath
resize: 헤더를 사용하여 커럼 폭 크기 조절 여부
rowMouseOver: 마우스 오버시 행 선택 표시 여부
rowMouseOverColor: 마우스 오버시 행의 배경색
rowNumBackgroundColor: 그리드 행 번호 배경 영역의 색상
rowNumHeaderValue: 그리드 행 번호 표시시 그리드 헤더에 표시할 텍스트
rowNumVisible: 그리드 행 번호 표시 여부
rowNumWidth: rowNum 컬럼의 width
rowStatusHeaderValue: 그리드 행 상태 표시시 그리드 헤더의 표시할 텍스트
rowStatusVisible: 그리드 행 상태 표시 여부
rowStatusWidth: rowStatus 컬럼의 width
scrollByColumn: 가로 스크롤시 컬럼 단위 이동
selectedCellColor: 선택된 셀의 배경색
selectedCellOverColor: 선택된 셀에 마우스 오버시 배경색(지정하지 않으면 rowMouseOverColor을 사용)
selectedRowColor: 선택된 행의 배경색
selectedRowOverColor: 선택된 행에 마우스 오버시 배경색(지정하지 않으면 rowMouseOverColor을 사용)
senseReader: 웹 접근성을 지원하기 위한 모드. 이 모드를 활성화시키면 tab키로 그리드의 모든 cell을 순회할 수 있습니다.
showSortableImage: 그리드의 해당 컬럼이 정렬가능한 경우, 해당 컬럼의 헤더에 이미지를 출력할지에 대한 여부
sortable: 그리드의 헤더 클릭을 통한 데이터 정렬 지원 여부
sortEvent: 데이터 정렬을 위한 이벤트 설정
sortOrderReverse: 그리드의 헤더 클릭을 통한 데이터 정렬시 내림차순 정렬을 먼저 할지 여부
summary: 그리드 요약
tooltipDisplay: 그리드의 셀 크기보다 긴 데이터의 경우 툴팁 사용 여부
tooltipFormatter: tooltip의 내용(label)을 사용자 함수의 return값으로 표현하도록 하는 속성. 사용자 함수는 rowIndex, colIndex, label을 인자로 받아 string을 return한다.
tooltipPositionX: tooltip의 x좌표를 설정하는 옵션. cell의 왼쪽 끝이 x좌표 원점. cellWidth, cellHeight 표현식을 사용할 수 있다. 오른쪽 끝을 원점으로 두려면 cellWidth를 더하면 된다.기본값은 "20", 즉 cell의 왼쪽 끝에서 20px 떨어진 곳을 의미.
tooltipPositionY: tooltip의 y좌표를 설정하는 옵션. cell의 위쪽 끝이 y좌표 원점. cellWidth, cellHeight 표현식을 사용할 수 있다. 아래쪽 끝을 원점으로 두려면 cellHeight를 더하면 된다. 기본값은 "3+cellHeight", 즉 cell의 아래쪽 끝에서 3px 떨어진 곳을 의미.
tooltipShowAlways: tooltip을 텍스트 길이에 상관없이 마우스 오버 시 항상 보여줄지에 대한 여부. true시 label값이 공백("")인 경우를 제외하고는 항상 보여준다.
useCtrlKey: [default:true, false] ctrl키를 누르고 여러 개의 셀을 선택할지 여부.
useCtrlOnMultisort: [default:true, false] 여러 개의 컬럼에 소팅을 하고자 할 때 ctrl키를 누르고 컬럼들을 선택할지 여부.
userData1: 사용자 정의 데이터 속성. getUserData("userData1") API를 통해 설정한 값을 얻어올 수 있다.
userData2: 사용자 정의 데이터 속성. getUserData("userData2") API를 통해 설정한 값을 얻어올 수 있다.
userData3: 사용자 정의 데이터 속성. getUserData("userData3") API를 통해 설정한 값을 얻어올 수 있다.
useShiftKey: shiftKey를 이용하여 복수의 셀 선택 여부
valueNode: 실제 데이터를 갖고 있는 attribute 이름, 빈 값의 경우 텍스트 노드에 셀 데이터를 갖음
visibleRowNum: 표시 항목행수. "all"이라면 모든 row가 표시됨
wheelRows: 세로 휠 이동시 한번 이동하는 행의 개수
wheelStop: [default:false] 그리드 스크롤이 맨 아래로 내려갔을 때 wheel을 한 경우 브라우저 스크롤을 막을지에 대한 여부

Event Detail

onafteredit

셀의 수정이 끝나서 포커스가 빠져나온 경우 발생하며, oneditend후에 발생

Parameter
name	type	description
row	Number	셀의 행번호
col	Number	셀의 열번호
value	String	셀의 입력된 값

Sample

onbeforeedit

셀 수정모드로 들어가기 전에 발생

Parameter
name	type	description
row	Number	셀의 행번호
col	Number	셀의 열번호
value	String	셀의 입력된 값

Sample

onbodymouseover

그리드의 body에 마우스가 오버된 경우 발생

Parameter
name	type	description
info	Object	rowIndex, colIndex를 포함한 오브젝트를 반환한다.

Sample

oncellclick

셀이 클릭된 경우 발생

Parameter
name	type	description
row	Number	클릭된 셀의 행 번호
col	Number	클릭된 셀의 열 번호

Sample

oncelldblclick

셀이 더블 클릭된 경우 발생

Parameter
name	type	description
row	Number	클릭된 셀의 행 번호
col	Number	클릭된 셀의 열 번호

Sample

oncellindexchange

셀 선택(방항키, 마우스)하여 셀의 인덱스가 바뀐 경우 발생

Parameter
name	type	description
row	Number	셀의 새로운 행번호
col	Number	셀의 새로운 열번호
oldRow	Number	셀의 예전 행번호
oldCol	Number	셀의 예전 행번호

Sample

onchange

셀의 데이터가 바뀐경우 발생

Parameter
name	type	description
row	Number	data가 바뀐 셀의 행 번호
col	Number	data가 바뀐 셀의 열 번호
newData	String	새로 설정된 data
oldData	String	바뀌기 전의 data

Sample

oncolumnindexchange

셀 선택(방항키, 마우스)하여 열의 인덱스가 바뀐 경우 발생

Parameter
name	type	description
col	Number	새로운 열번호
oldCol	Number	예전 열번호

Sample

oneditend

셀의 에디트가 끝난 경우 발생하며, onafteredit보다 먼저 발생

Parameter
name	type	description
row	Number	셀의 행번호
col	Number	셀의 열번호
value	String	입력한 값

Sample

oneditkeydown

셀의 에디트시 키를 누른 경우 발생하며, opera와 firefox에서 2byte짜리 문자(한글)를 입력할 때는 첫 입력시 또는 문자 조합이 완료된 후에만 발생한다.

Parameter
name	type	description
info	Object	rowIndex, colIndex를 포함한 오브젝트를 반환한다.

Sample

onfilereadend

엑셀업로드가 끝난 경우 발생

Parameter
name	type	description
value	String

Sample

onfooterclick

footer가 클릭된 경우 발생

Parameter
name	type	description
footerId	String	클릭된 footer의 id

Sample

onheaderclick

header가 클릭된 경우 발생

Parameter
name	type	description
headerId	String	클릭된 header의 id

Sample

onrightbuttonclick

마우스 오른쪽 버튼이 클릭된 경우 발생

Parameter
name	type	description
row	Number	클릭된 셀의 행 번호
col	Number	클릭된 셀의 열 번호

Sample

onrowindexchange

셀 선택(방항키, 마우스)하여 행의 인덱스가 바뀐 경우 발생

Parameter
name	type	description
row	Number	새로운 행번호
oldRow	Number	예전 행번호

Sample

onscrollend

세로 스크롤이 loadcount 만큼 행을 남긴 경우 발생

onscrollx

가로 스크롤을 움직이는 경우 발생

onscrolly

세로 스크롤을 움직이는 경우 발생

onsort

sortable 속성이 적용된 헤더에서 클릭이나 더블클릭을 통하여 정렬방식이 변경되었을 경우 발생

ontextimageclick

inputType 이 textImage 인 경우 image가 클릭 된 경우 발생

Parameter
name	type	description
row	Number	클릭된 셀의 행 번호
col	Number	클릭된 셀의 열 번호

Sample

onviewchange

셀의 데이터가 키보드나 마우스 조작을 통해 변경된 경우에만 발생하는 이벤트. 스크립트를 통해 값이 변경된 경우에는 해당 이벤트가 발생하지 않습니다. (native onchange 이벤트와 유사합니다.)

Parameter
name	type	description
info	Object	oldValue, newValue, rowIndex, colIndex를 포함한 오브젝트를 반환합니다.

Sample

Method Detail

addClass( className )

컴포넌트에 class를 추가한다.

Parameter
name	type	required	description
className	String	Y	추가하고 싶은 class의 이름

Sample

//input1 컴포넌트에 oddClass 라는 class를 추가 할 때 input1.addClass("oddClass");

advancedExcelDownload( options , infoArr )

그리드의 데이터를 엑셀 파일로 저장합니다. (JDK 1.5이상에서 사용 가능)

Parameter
name	type	required	description
options	Object	Y	JSON형태로 저장된 그리드의 엑셀 다운로드 옵션
infoArr	Object	N	그리드에 대한 내용을 추가로 다른 셀에 표현하는 경우 사용하는 배열

Sample

// id가 a,b,c,d,e인 5개 컬럼이 존재하는 그리드 var options = { fileName: "user.xls", type: "1", removeColumns: "1,3", foldColumns: "2", startRowIndex: 3, startColumnIndex: 0, headerColor: "#DBEEF3", footerColor: "#92CDDC", showProcess: true, dataProvider: "com.provider.Provider1", providerRequestXml: WebSquare.xml.serialize(WebSquare.ModelUtil.findInstanceNode("request")) }; var infoArr = []; var infoObj = { rowIndex: 1, colIndex: 3, rowSpan: 1, colSpan: 2, text: "데이터표시", textAlign: "center" }; infoArr.push( infoObj ); grid1.advancedExcelDownload(options , infoArr); A || C D E F ┌──────────────┐┌──────────┬──────┬──────┬──── 1 | || | | | | || ┌──────┴──────┐ 2 | || | 데이터표시 | | || └──────┬──────┘ 3 | || | | | 4 | a || e | | | -> 그리드 헤더. 5 | Renaissance || 20111231 | | | -> 그리드 데이터. 6 | ... (생략)

advancedExcelUpload( options )

엑셀 파일을 읽어 그리드의 데이터를 설정합니다. (JDK 1.5이상에서 사용 가능)

Parameter
name	type	required	description
options	Object	Y	JSON형태로 저장된 그리드의 엑셀 업로드 옵션

Sample

var options = { type: "1", sheetNo: 0, startRowIndex: 3, startColumnIndex: 0, headerExist: "1", footerExist: "1", append: "0", hidden: "0", fillHidden: "0", skipSpace: "1" }; grid1.advancedExcelUpload(options);

bind( eventType , function )

컴포넌트의 이벤트를 동적으로 할당한다.

Parameter
name	type	required	description
eventType	String	Y	할당 할 이벤트명.
function	Function	Y	동적으로 할당 할 이벤트의 핸들러 function.

Sample

//input1에 onclick 이벤트에 핸들러 function을 직접 정의하여 bind. input1.bind("onclick", function(e){ alert(input1.getValue();})); //input1에 onclick 이벤트에 미리 정의 한 commObj.ev_click function을 bind. var commObj = {}; commObj.ev_click = function(e){ alert("click :: "+this.id); }; input1.bind("onclick", commObj.ev_click );

changeClass( oldClassName , newClassName )

컴포넌트에서 oldClassName의 이름을 가진 class를 newClassName으로 변경한다.
기본 설정은 addClass API를 통해 추가 된 class만 적용되며 컴포넌트의 class 속성에 직접 정의 된 class를 삭제해야하는 경우는 config.xml파일의 설정을 아래와 같이 적용해야한다.
<style><removeDefaultClass value="true" /></style>

Parameter
name	type	required	description
oldClassName	String	Y	삭제 할 class의 이름
newClassName	String	Y	추가 할 class의 이름

Sample

//아래와 같이 input 컴포넌트에 class를 정의 한 경우 <xf:input id="input1" style="position: relative;width: 144px;height: 21px;" class="tmpInputClass"></xf:input> //config.xml 파일에 아래와 같이 정의. <style> <removeDefaultClass value="true" /> </style> //tmpInputClass class를 tmpInputWarninClass로 변경 input1.changeClass("tmpInputClass","tmpInputWarninClass");

checkAll( colIndex , dataValue )

체크 박스로 이루어진 열을 한번에 체크하거나 언체크합니다.

Parameter
name	type	required	description
colIndex	String	Y	체크 박스 열의 column id 또는 index
dataValue	String	Y	열의 체크박스의 true값 또는 false값

Sample

grid1.checkAll('a', true); // 'a' 컬럼의 checkbox가 모두 선택된다.

clearGroupby( )

grid groupby를 해제합니다.

Sample

grid1.clearGroupby(); // groupby를 취소한다.

clearSort( )

그리드의 모든 정렬을 취소해줍니다.

Sample

grid1.clearSort(); // 정렬을 취소한다.

deleteRow( rowIndex )

rowInex에 해당하는 행의 상태 값을 삭제로 바꿔줍니다. (row를 삭제하지는 않는다)

Parameter
name	type	required	description
rowIndex	Number	Y	삭제상태로 변경할 행의 번호

Sample

grid1.deleteRow(0); // 첫 번째 row의 rowStatus 값을 delete 상태로 변경. (rowStatusValue: 3, rowStatus: D)

focus( )

컴포넌트에 focus를 준다.

getAllData( )

그리드의 모든 data를 배열로 반환합니다.

Return
type	description
Object	그리드의 data 배열 (1차원 배열)

Sample

// id가 a,b,c,d,e인 5개 컬럼이 존재하는 그리드에서 전체 행이 20 Row인 경우. var returnArr = grid1.getAllData(); returnArr.length 는 100이다. returnArr[0] 은 첫번째 행의 a컬럼의 값. returnArr[1] 은 첫번째 행의 b컬럼의 값. ... returnArr[5] 는 두번째 행의 a컬럼의 값. ...

getAllDisplayData( )

그리드의 화면에 보이는 data를 배열로 반환합니다.(filter는 적용하지 않음.)

Return
type	description
Object	그리드의 화면에 보이는 data 배열 (1차원 배열)

Sample

// id가 a,b,c,d,e인 5개 컬럼이 존재하는 그리드에서 a컬럼의 dataType이 date이고 b컬럼의 dataType이 number이며 각각의 displayFormat이 yyyy.MM.dd, #,###인 경우. // 전체 20 행이며, 첫번째 행의 각 컬럼의 데이터는 다음과 같다. ( 20120101 , 23456 , Inswave , WebSquare , sample ) var returnArr = grid1.getAllDisplayData();
returnArr.length 는 100이다.
returnArr[0] 은 첫번째 행의 a컬럼의 값. ( 예: 2012.01.01 )
returnArr[1] 은 첫번째 행의 b컬럼의 값. ( 예: 23,456 )
...
returnArr[5] 는 두번째 행의 a컬럼의 값. ( 예: 2012.01.02 )
...

getAllDisplayXML( )

그리드의 모든 data를 XML로 반환합니다.(filter 적용하지 않음)

Return
type	description
Xml Element	그리드의 data

Sample

// id가 a,b,c,d,e인 5개 컬럼이 존재하는 그리드에서 a컬럼의 dataType이 date이고 b컬럼의 dataType이 number이며 각각의 displayFormat이 yyyy.MM.dd, #,###인 경우. // 첫번째 행의 각 컬럼의 데이터는 다음과 같다. ( 20120101 , 23456 , Inswave , WebSquare , sample ) var returnXMLStr = WebSquare.xml.indent(grid1.getAllDisplayXML());
baseNode : gridData , repeatNode : vector , valueNode : value 일 경우,
returnXMLStr은 예는 다음과 같다. <gridData> <vector status="0" statusValue="R" id="0"> <a value = "2012.01.01"/> <b value = "23,456"/> <c value = "Inswave"/> <d value = "WebSquare"/> <e value = "sample"/> </vector> <vector status="0" statusValue="R" id="1"> <a value = "2012.01.02"/> <b value = "34,567"/> <c value = "Inswave"/> <d value = "WebSquare"/> <e value = "sample2"/> </vector> ... (중략) </gridData>

getAllFocusedIndex( )

포커스가 위치한 모든 셀의 rowIndex와 colIndex를 반환합니다.

Return
type	description
Array	포커스가 위치한 모든 셀의 rowIndex와 colIndex의 정보를 가진 array

Sample

var returnValue = grid1.getAllFocusedIndex(); // returnValue는 포커스가 위치한 모든 셀의 rowIndex와 colIndex의 정보를 가진 array.

getAllVisibleData( )

그리드의 현재 보이는 data를 배열로 반환합니다. (filter까지 적용)

Return
type	description
Object	그리드의 현재 보이는 data (1차원 배열)

Sample

var returnArr = grid1.getAllVisibleData(); // grid1.getAllDisplayData(); 에서 filter를 적용한 것과 같다.

getAllVisibleXML( )

그리드의 현재 보이는 data를 XML로 반환합니다.(filter까지 적용)

Return
type	description
Xml Element	그리드의 현재 보이는 data

Sample

var returnXMLStr = WebSquare.xml.indent(grid1.getAllVisibleXML()); // grid1.getAllDisplayXML(); 에서 filter를 적용한 것과 같다.

getAllXML( )

그리드의 모든 data를 XML로 반환합니다.

Return
type	description
Xml Element	그리드의 data

Sample

// id가 a,b,c,d,e인 5개 컬럼이 존재하는 그리드 var returnXMLStr = WebSquare.xml.indent(grid1.getAllXML()); baseNode : gridData , repeatNode : vector , valueNode : value 일 경우, returnXMLStr은 예는 다음과 같다. <gridData> <vector status="0" statusValue="R" id="0"> <a value = "20120101"/> <b value = "23456"/> <c value = "Inswave"/> <d value = "WebSquare"/> <e value = "sample"/> </vector> <vector status="0" statusValue="R" id="1"> <a value = "20120102"/> <b value = "34567"/> <c value = "Inswave"/> <d value = "WebSquare"/> <e value = "sample2"/> </vector> ... (중략) </gridData>

getBottomRowIndex( )

현재 그리드에 그려진 최하단 row의 rowIndex를 반환합니다. 그려진 row가 없으면 -1을 반환합니다.

Return
type	description
Number	최하단 row의 rowIndex

Sample

var returnValue = grid1.getBottomRowIndex(); // returnValue는 스크롤 변화에 따라 현재 그리드에 보이는 최하단 행의 index.

getCellBackgroundColor( rowIndex , colIndex )

rowIndex와 colIndex에 해당하는 셀의 배경색을 반환합니다.

Parameter
name	type	required	description
rowIndex	Number	Y	배경색을 반환할 행 번호
colIndex	String	Y	배경색을 반환할 열 번호 혹은 컬럼 아이디

Return
type	description
String	해당 행에 지정된 배경색

Sample

grid1.getCellBackgroundColor(0, 'a'); // returnValue는 첫번째 행 a컬럼의 배경색.

getCellChecked( rowIndex , colIndex )

rowIndex와 colIndex로 해당하는 셀의 check여부를 반환합니다.

Parameter
name	type	required	description
rowIndex	Number	Y	셀의 행번호
colIndex	Number	Y	셀의 열번호 혹은 컬럼 아이디

Return
type	description
Boolean	셀의 check여부

Sample

var returnValue = grid1.getCellChecked(0, 'a'); // returnValue는 첫 번째 행, 컬럼 'a'인 cell의 check 여부

getCellColor( rowIndex , colIndex )

rowIndex와 colIndex에 해당하는 셀의 글자색을 반환합니다.

Parameter
name	type	required	description
rowIndex	Number	Y	글자색을 반환할 행 번호
colIndex	String	Y	글자색을 반환할 열 번호 혹은 컬럼 아이디

Return
type	description
String	행당 행의 글자색

Sample

grid1.getCellColor(0, 'a'); // returnValue는 첫번째 행 a컬럼의 글자색.

getCellData( rowIndex , colIndex )

rowIndex와 colIndex에 해당하는 셀의 데이터를 반환합니다.

Parameter
name	type	required	description
rowIndex	Number	Y	셀의 행 번호
colIndex	String	Y	셀의 컬럼 번호 혹은 컬럼의 아이디

Return
type	description
String	rowIndex와 colIndex에 해당하는 셀의 데이터

Sample

var returnValue = grid1.getCellData(0, "a"); // 첫 번째 row, "a" column에 해당하는 cell의 displayFormat이 적용되지 않은 실제 데이터를 반환

getCellDisabled( rowIndex , colIndex )

colIndex와 rowIndex 해당하는 셀의 disabled속성 값을 반환합니다.

Parameter
name	type	required	description
rowIndex	Number	Y	disabled속성을 가져올 행 번호
colIndex	String	Y	disabled속성을 가져올 열 번호 혹은 컬럼 아이디

Return
type	description
Boolean	해당 셀에 적용된 disabled속성값

Sample

var returnValue = grid1.getCellDisabled(0, 'a'); // returnValue는 첫번째 행의 a컬럼에 적용된 disabled 값.

getCellDisplayData( rowIndex , colIndex )

rowIndex와 colIndex에 해당하는 셀의 화면에 보이는 데이터를 반환합니다.

Parameter
name	type	required	description
rowIndex	Number	Y	셀의 행 번호
colIndex	String	Y	셀의 컬럼 번호 혹은 컬럼 아이디

Return
type	description
String	rowIndex와 colIndex에 해당하는 셀의 화면에 보이는 데이터

Sample

var returnValue = grid1.getCellDisplayData(0, "a"); // 첫 번째 row, "a" colum에 해당하는 cell에 표시된 값을 반환한다.

getCellPosition( row , colIndex , propertyName )

셀의 위치 정보(top이나 left)를 반환합니다.

Parameter
name	type	required	description
row	Number	Y	셀의 행 번호(세로 스크롤 위치와는 무관하게 현재 그리드에서 최상단 행에 위치한 셀의 행 번호를 0으로 보고 세어야 한다)
colIndex	String	Y	셀의 컬럼 번호 혹은 컬럼의 아이디
propertyName	String	Y	반환할 위치 정보의 이름('top' 또는 'left')

Return
type	description
Number	셀의 위치 정보(top이나 left)의 값

Sample

var returnValue = grid1.getCellPosition(0, 'b', 'left'); // returnValue는 그리드에서 해당 cell이 위치한 left 값을 반환.

getCellReadOnly( rowIndex , colIndex )

colIndex와 rowIndex에 해당하는 셀의 readonly속성 값을 반환합니다.

Parameter
name	type	required	description
rowIndex	Number	Y	readonly속성을 가져올 행 번호
colIndex	String	Y	readonly속성을 가져올 열 번호 혹은 컬럼 아이디

Return
type	description
Boolean	해당 셀에 적용된 readonly속성값

Sample

var returnValue = grid1.getCellReadOnly(0, 'a'); // returnValue는 첫번째 행의 a컬럼에 적용된 readOnly값.

getCellSize( row , colIndex , sizeName )

셀의 크기 정보(width나 height)를 반환합니다.

Parameter
name	type	required	description
row	Number	Y	셀의 행 번호
colIndex	String	Y	셀의 컬럼 번호 혹은 컬럼의 아이디
sizeName	String	Y	반환할 크기 정보의 이름('width' 또는 'height')

Return
type	description
Number	셀의 크기 정보(width나 height)의 값

Sample

var returnValue = grid1.getCellSize(0, 'b', 'width'); // returnValue는 그리드에서 해당 cell의 width 값을 반환.

getCheckedData( colIndex )

colIndex에 해당하는 열이 radio/checkbox일 경우 check된 행의 data를 배열로 반환합니다. 해당 컬럼이 checkbox가 아닐경우 비어있는 배열을 반환합니다.

Parameter
name	type	required	description
colIndex	Number	Y	checkbox여부를 검사할 열번호 혹은 컬럼 아이디

Return
type	description
Object	data를 저장한 배열 (2차원 배열)

Sample

var returnArr = grid1.getCheckedData('a'); // returnArr는 'a' 컬럼 중 선택된 행의 데이터 배열.

getCheckedIndex( colIndex )

colIndex에 해당하는 열의 radio/checkbox가 check된 행의 Index를 배열로 반환합니다.

Parameter
name	type	required	description
colIndex	Number	Y	checkbox여부를 검사할 열번호 혹은 컬럼 아이디

Return
type	description
Object	행번호를 저장한 배열

Sample

var returnArr = grid1.getCheckedIndex('a'); // returnArr는 선택된 행의 index 배열.

getCheckedXML( colIndex )

colIndex에 해당하는 열이 radio/checkbox일 경우 check된 행의 data를 XML로 반환합니다.

Parameter
name	type	required	description
colIndex	Number	Y	checkbox여부를 검사할 열번호 혹은 컬럼 아이디

Return
type	description
Xml element	data를 저장한 XML

Sample

var returnXML = grid1.getCheckedXML('a'); // returnXML은 'a' 컬럼 중 선택된 행들의 데이터 XML.

getChildrenRowIndexArray( rowIndex )

drilldown 사용시 rowIndex에 해당하는 행의 자식 행들의 rowIndex를 배열로 반환합니다.

Parameter
name	type	required	description
rowIndex	Number	Y	자식을 찾으려는 행의 번호

Sample

var rowIdx = 0; var childrenArr = grid1.getChildrenRowIndexArray(rowIdx); // 해당 rowIdx가 그리드에 존재하는 경우, childrenArr는 자식 행들의 배열이다.

getColData( colIndex )

colIndex에 해당하는 열의 데이터(filter나 sort처리되지 않은)를 배열로 반환합니다.

Parameter
name	type	required	description
colIndex	Number	Y	데이터를 가져올 열 번호 혹은 컬럼 아이디

Return
type	description
Object	colIndex에 해당하는 열의 데이터의 배열

Sample

var returnArr = grid1.getColData('a'); // returnArr는 'a' 컬럼의 데이터 배열.

getColIdByHeaderId( headerId )

sort에서 주어진 headerId에 해당하는 header를 클릭했을때 참조하는 body의 columnId를 반환한다

Parameter
name	type	required	description
headerId	String	Y	header의 ID

Return
type	description
String	body의 columnId

Sample

var returnValue = grid1.getColIdByHeaderId("hName"); // returnValue는 headerId에 대응되는 body의 컬럼 아이디.

getColumnBackgroundColor( colIndex )

colIndex에 해당하는 열의 배경색을 반환합니다.

Parameter
name	type	required	description
colIndex	String	Y	배경색을 반환할 열 번호 혹은 컬럼 아이디

Return
type	description
String	해당 열에 지정된 배경색

Sample

var returnValue = grid1.getColumnBackgroundColor('a'); // returnValue는 a컬럼의 배경색.

getColumnColor( colIndex )

colIndex에 해당하는 열의 글자색을 반환합니다.

Parameter
name	type	required	description
colIndex	String	Y	글자색을 반환할 열 번호 혹은 컬럼 아이디

Return
type	description
String	행당 열에 글자색

Sample

var returnValue = grid1.getColumnColor('a'); // returnValue는 a컬럼의 글자색.

getColumnDisabled( colIndex )

colIndex에 해당하는 열에 disabled속성 값을 반환합니다.

Parameter
name	type	required	description
colIndex	String	Y	disabled속성을 가져올 열 번호 혹은 컬럼 아이디

Return
type	description
Boolean	해당 열에 적용된 disabled속성값

Sample

var returnValue = grid1.getColumnDisabled('a'); // returnValue는 a 컬럼에 적용된 disabled값.

getColumnDistinctDataArray( colIndex )

해당 colIndex에 존재하는 중복된 항목을 제거한 data를 배열을 정렬하여 보여줍니다.

Parameter
name	type	required	description
colIndex	Number	Y

Return
type	description
Object	data를 저장한 배열

getColumnID( colIndex )

그리드의 컬럼 index를 입력받아 그에 해당하는 컬럼의 id를 반환합니다.

Parameter
name	type	required	description
colIndex	Number	Y	그리드 컬럼 index

Return
type	description
String	그리드 컬럼의 id

Sample

var returnValue = grid1.getColumnID(0); // 첫 번째 column의 id를 반환한다.

getColumnIndex( colIndex )

그리드의 컬럼 id를 입력받아 그에 해당하는 컬럼의 index를 반환합니다.

Parameter
name	type	required	description
colIndex	String	Y	그리드 컬럼 id

Return
type	description
Number	그리드 컬럼의 index

Sample

var returnValue = grid1.getColumnIndex('a'); // id가 "a"인 컬럼의 index를 반환한다.

getColumnOrder( byName )

현재 그리드의 컬럼 순서를 배열로 반환합니다. 기본적으로는 컬럼 index를 담은 배열을 반환하고, byName 값에 따라 컬럼 id를 담은 배열을 반환합니다.

Parameter
name	type	required	description
byName	Boolean	N	반환할 컬럼의 순서에서 컬럼 index 대신 컬럼 id를 사용할지 여부

Return
type	description
Array	현재 그리드의 컬럼 순서를 차례대로 담고 있는 배열

getColumnReadOnly( colIndex )

colIndex에 해당하는 열에 적용된 readonly속성 값을 반환합니다.

Parameter
name	type	required	description
colIndex	String	Y	readonly속성을 가져올 열 번호 혹은 컬럼 아이디

Return
type	description
Boolean	해당 열에 적용된 readonly속성값

Sample

var returnValue = grid1.getColumnReadOnly('a'); // returnValue는 a 컬럼에 적용된 readOnly값.

getColumnType( colIndex )

colIndex에 해당하는 열의 inputType 속성값을 반환합니다.

Parameter
name	type	required	description
colIndex	String	Y	체크 박스 Column id 또는 index

Return
type	description
String	colIndex해당하는 컬럼의 타입

Sample

var returnValue = grid1.getColumnType('a'); // 'a' 컬럼의 inputType을 반환

getColumnVisible( colIndex )

colIndex에 해당하는 열의 visible여부를 반환합니다.

Parameter
name	type	required	description
colIndex	Number	Y	visible여부를 반환할 colunm의 index

Return
type	description
Boolean	column의 visible여부

Sample

var returnValue = grid1.getColumnVisible("a"); // returnValue의 값은 id가 "a"인 컬럼의 visible 여부

getDataLength( )

현재 화면에 보이는 행의 수를 반환합니다. getRowCount()와 동일.

Return
type	description
number	행의 수

Sample

var returnValue = grid1.getDataLength(); // grid1의 row수를 반환

getDataRow( rowIndex )

rowIndex에 해당하는 행의 데이터를 컬럼의 아이디를 키로 하는 해쉬 형태로 반환합니다.

Parameter
name	type	required	description
rowIndex	Number	Y	데이터를 가져올 행 번호

Return
type	description
Object	rowIndex에 해당하는 행의 데이터의 배열

Sample

//id가 a,b,c,d,e인 5개 컬럼이 존재하는 그리드에서 a컬럼의 dataType이 date이고 b컬럼의 dataType이 number이며 각각의 displayFormat이 yyyy.MM.dd, #,###인 경우. //첫번째 행의 각 컬럼의 데이터는 다음과 같다. ( 20120101 , 23456 , Inswave , WebSquare , sample ) var dataHash = grid1.getDataRow(0); for(var i in dataHash){ alert( i + ' : ' + dataHash[i] ); } 출력되는 데이터는 다음과 같다. a : 20120101 b : 23456 c : Inswave d : WebSquare e : sample

getDeletedData( )

삭제 상태인 행들을 배열로 반환합니다.

Return
type	description
Object	삭제 상태인 행들의 데이터 배열 (2차원 배열)

Sample

var returnArr = grid1.getDeletedData(); // returnArr는 삭제 상태(3,4, D,V)의 행들의 데이터 배열.

getDeletedIndex( )

삭제 상태인 행의 번호를 배열로 반환합니다.

Return
type	description
Object	삭제 상태인 행의 번호의 배열

Sample

var returnArr = grid1.getDeletedIndex(); // returnArr는 삭제 상태(3,4, D,V)의 행들의 배열.

getDeletedXML( )

삭제 상태인 행들의 데이터를 XML로 반환합니다.

Return
type	description
XML Element	삭제 상태인 행들의 데이터 XML

Sample

var returnXMLStr = WebSquare.xml.indent(grid1.getDeletedXML()); // returnXMLStr 은 삭제 상태(3,4, D,V)의 행들의 데이터 XML 문자열.

getDisabled( type , rowIndex , colIndex )

type에 따라 disabled 속성을 반환합니다.

Parameter
name	type	required	description
type	String	Y	disabled 속성을 가져올 type (grid, row, column, cell, all 총 5개)
rowIndex	Number	Y	disabled속성을 가져올 행 번호
colIndex	Number	Y	disabled속성을 가져올 열 번호

Return
type	description
Boolean	해당 type에 적용된 disabled속성값

Sample

var returnValue = grid1.getDisabled("grid"); // returnValue는 그리드 전체에 적용된 disabled값. var returnValue = grid1.getDisabled("row", 0); // returnValue는 첫번째 행에 적용된 disabled값. var returnValue = grid1.getDisabled("cell", 0, 4); // returnValue는 첫번째 행의 다섯번째 열의 셀에 적용된 disabled값. var returnValue = grid1.getDisabled("all", 0, 4); // returnValue는 첫번째 행의 다섯번째 열의 셀에 최종적으로 적용된 disabled값.

getFocusedColumnID( )

포커스가 위치한 셀이 속한 column의 ID를 반환합니다.

Return
type	description
String	포커스가 위치한 셀이 속한 column의 ID

Sample

var returnValue = grid1.getFocusedColumnID(); // returnValue는 포커스가 위치한 셀이 속한 column의 ID.

getFocusedColumnIndex( )

포커스가 위치한 셀의 colIndex를 반환합니다.

Return
type	description
Number	포커스가 위치한 셀의 colIndex

Sample

var returnValue = grid1.getFocusedColumnIndex(); // returnValue는 포커스가 위치한 셀의 colIndex.

getFocusedRowIndex( )

포커스가 위치한 셀의 rowIndex를 반환합니다.

Return
type	description
Number	포커스가 위치한 셀의 rowIndex

Sample

var returnValue = grid1.getFocusedRowIndex(); // returnValue는 포커스가 위치한 셀의 rowIndex.

getFocusedRowStatus( )

포커스가 위치한 셀이 속한 row의 상태 값(문자)를 반환합니다.

Return
type	description
String	포커스가 위치한 셀이 속한 row의 상태를 나타내는 문자 (초기상태:"R", 갱신:"U", 삽입:"C", 삭제:"D", 삽입 후 삭제:"V")

Sample

var returnValue = grid1.getFocusedRowStatus(); // returnValue는 포커스가 위치한 셀이 속한 row의 상태를 나타내는 문자.

getFooterData( footerId , display )

footerId에 해당하는 footer의 값을 반환합니다. inputType이 expression인 경우 계산된 값을 반환합니다.

Parameter
name	type	required	description
footerId	string	Y	footer의 아이디 혹은 인덱스
display	string	Y	값이 displayData인 경우에 foramt된 값 반환

Return
type	description
string	footerId에 해당하는 footer의 값

Sample

footer id가 total이며, inputType이 expression, expression은 sum('c')인 경우. dataType은 number, displayFormat은 #,###으로 적용되었을 때, var returnValue = grid1.getFooterData('total', 'displayData')); returnValue는 id가 total인 footer의 값(id가 c인 컬럼의 합)에 format이 적용되어 반환. 예: 23,456

getFooterStyle( footerId , style )

그리드의 footerId에 해당하는 footer의 스타일 속성값을 가져옵니다.

Parameter
name	type	required	description
footerId	Number	Y	그리드 컬럼의 인덱스
style	String	Y	가져올 스타일 속성

Sample

grid1.getFooterStyle("a", "background-color"); // id가 "a"인 컬럼의 "background-color"속성값을 가져옵니다.

getGridReadOnly( )

그리드의 읽기 전용 속성을 반환합니다.

Return
type	description
Boolean	그리드의 읽기 전용 속성

Sample

var returnValue = grid1.getGridReadOnly(); // grid의 readOnly 속성이 true인 경우, returnValue는 true이다.

getHeaderBackgroundColor( headerId )

그리드의 헤더 셀에 적용된 배경색 값을 가져옵니다.

Parameter
name	type	required	description
headerId	String	Y	header cell의 id

Return
type	description
String	그리드의 헤더 셀에 현재 적용된 배경색 값

Sample

var headerBackgroundColor = grid1.getHeaderBackgroundColor("column2");

getHeaderColor( headerId )

그리드의 헤더 셀에 적용된 글씨 색상값을 가져옵니다.

Parameter
name	type	required	description
headerId	String	Y	header cell의 id

Return
type	description
String	그리드의 헤더 셀에 적용된 글씨 색상값

Sample

var headerFontColor = grid1.getHeaderColor("column2");

getHeaderID( header )

header index로 header id를 찾아옵니다.

Parameter
name	type	required	description
header	Number	Y	index

Sample

grid1.getHeaderID( 0 ); // index가 0인 header id를 얻어옵니다.

getHeaderIndex( header )

header id로 header index를 찾아옵니다.

Parameter
name	type	required	description
header	String	Y	id

Sample

grid1.getHeaderIndex( "aa" ); // id가 aa인 header index를 얻어온다.

getHeaderPosition( headerId , propertyName )

header의 위치 정보(top이나 left)를 반환합니다.

Parameter
name	type	required	description
headerId	String	Y	header의 Id
propertyName	String	Y	반환할 위치 정보의 이름('top' 또는 'left')

Return
type	description
Number	header의 위치 정보(top이나 left)의 값

Sample

var returnValue = grid1.getHeaderPosition('b', 'left'); // returnValue는 그리드에서 해당 header가 위치한 left 값을 반환.

getHeaderSize( headerId , sizeName )

header의 크기 정보(width나 height)를 반환합니다.

Parameter
name	type	required	description
headerId	String	Y	header의 Id
sizeName	String	Y	반환할 크기 정보의 이름('width' 또는 'height')

Return
type	description
Number	header의 크기 정보(width나 height)의 값

Sample

var returnValue = grid1.getHeaderSize('b', 'width'); // returnValue는 그리드에서 해당 header의 width 값을 반환.

getHeaderValue( headerId )

헤더의 값을 반환합니다. 안 쪽에 nobr태그가 있는 경우에는 text부분까지 찾아서 반환합니다.

Parameter
name	type	required	description
headerId	String	Y	header의 아이디

Return
type	description
String	header가 가지고 있는 value

Sample

var returnValue = grid1.getHeaderValue('hName'); // id가 'hName' 헤더 셀의 값.

getID( )

웹스퀘어 컴포넌트의 id를 반환한다.

Return
type	description
String	웹스퀘어 컴포넌트의 id

Sample

//동적으로 웹스퀘어 컴포넌트를 파라메터로 받았을 경우 아래와 같이 사용 할 수 있다. function fn_validCheck(tmpObj){ //tmpObj가 input1 이라는 ID를 가지고 있는 경우 var compID = tmpObj.getID(); //return 예시 ) "input1" }

getInsertedData( )

삽입 상태인 행들의 데이터를 배열로 반환합니다.

Return
type	description
Object	삽입 상태인 행들의 데이터 배열 (2차원 배열)

Sample

var returnArr = grid1.getInsertedData(); // returnArr는 삽입 상태(2, C)의 행들의 데이터 배열.

getInsertedIndex( )

삽입 상태인 행의 번호를 배열로 반환합니다.

Return
type	description
Object	삽입 상태인 행의 번호의 배열

Sample

var returnArr = grid1.getInsertedIndex(); // returnArr는 삽입 상태(2, C)의 행들의 배열.

getInsertedXML( )

삽입 상태인 행들의 데이터를 XML로 반환합니다.

Return
type	description
XML Element	삽입 상태인 행들의 데이터 XML

Sample

var returnXMLStr = WebSquare.xml.indent(grid1.getInsertedXML()); // returnXMLStr 은 삽입 상태(2, C)의 행들의 데이터 XML 문자열.

getMatchedColumnData( matchCol , dataValue , targetCol , exactMatch , stRowIndex , lastRowIndex )

stRowIndex부터 lastRowIndex-1 까지의 범위의 행중에서 colIndex의 값이 dataValue와 같은 행들을 찾아서 targetCol에 해당하는 열의 값들을 배열로 반환합니다.

Parameter
name	type	required	description
matchCol	Number	Y	데이터를 검사할 열번호 혹은 컬럼 아이디
dataValue	String	Y	colIndex해당하는 열의 값과 비교할 data
targetCol	Number	Y	데이터를 가져올 열번호
exactMatch	Boolean	Y	정확히 일치하는지 여부
stRowIndex	Number	Y	데이터를 가져오는 것을 시작할 행 번호
lastRowIndex	Number	Y	데이터를 가져오는 것을 끝낼 행 번호

Return
type	description
Object	targetCol에 해당하는 열의 값을 가지고 있는 배열 (1차원 배열)

Sample

var lastRowIndex = grid1.getRowCount() ; var returnArr = grid1.getMatchedColumnData( 'c', '영화', 'd', true, 0, lastRowIndex); // returnArr는 c컬럼의 값이 '영화'인 컬럼의 행 index에 해당하는 d컬럼의 데이터 배열.

getMatchedData( colIndex , dataValue , exactMatch , stRowIndex , lastRowIndex )

stRowIndex부터 lastRowIndex-1 까지의 범위의 행중에서 colIndex의 값이 dataValue와 같은 행들의 data를 배열로 반환합니다.

Parameter
name	type	required	description
colIndex	Number	Y	데이터를 검사할 열번호 혹은 컬럼 아이디
dataValue	String	Y	colIndex해당하는 열의 값과 비교할 data
exactMatch	Boolean	Y	정확히 일치하는지 여부
stRowIndex	Number	Y	데이터를 가져오는 것을 시작할 행 번호
lastRowIndex	Number	Y	데이터를 가져오는 것을 끝낼 행 번호

Return
type	description
Object	범위안의 data를 가지고 있는 배열 (2차원 배열)

Sample

var lastRowIndex = grid1.getRowCount(); var returnArr = grid1.getMatchedData( 'c', '영화', true, 0, lastRowIndex ); // returnArr는 그리드 전체에서 c컬럼의 값이 "영화" 인 행의 데이터 배열.

getMatchedIndex( colIndex , dataValue , exactMatch , stRowIndex , lastRowIndex )

stRowIndex부터 lastRowIndex-1 까지의 범위의 행중에서 colIndex의 값이 dataValue와 같은 행들의 index를 반환합니다.

Parameter
name	type	required	description
colIndex	String	Y	데이터를 검사할 열번호 혹은 컬럼 아이디
dataValue	String	Y	colIndex해당하는 열의 값과 비교할 data
exactMatch	Boolean	Y	정확히 일치하는지 여부
stRowIndex	Number	Y	데이터를 가져오는 것을 시작할 행 번호
lastRowIndex	Number	Y	데이터를 가져오는 것을 끝낼 행 번호

Return
type	description
Object	범위안에 일치하는 index를 가지고 있는 배열

Sample

var lastRowIndex = grid1.getRowCount(); var returnArr = grid1.getMatchedIndex( 'c', '영화', true, 0, lastRowIndex ); // returnArr는 그리드 전체에서 c컬럼의 값이 "영화" 인 행 Index의 배열.

getMatchedXML( colIndex , dataValue , exactMatch , stRowIndex , lastRowIndex )

stRowIndex부터 lastRowIndex까지의 범위의 행중에서 colIndex의 값이 dataValue와 같은 행들의 data를 XML로 반환합니다.

Parameter
name	type	required	description
colIndex	Number	Y	데이터를 검사할 열번호 혹은 컬럼 아이디
dataValue	String	Y	colIndex해당하는 열의 값과 비교할 data
exactMatch	Boolean	Y	정확히 일치하는지 여부
stRowIndex	Number	Y	데이터를 가져오는 것을 시작할 행 번호
lastRowIndex	Number	Y	데이터를 가져오는 것을 끝낼 행 번호

Return
type	description
Xml element	범위안의 data를 가지고 있는 XML

Sample

var lastRowIndex = grid1.getRowCount(); var returnXMLStr = WebSquare.xml.indent(grid1.getMatchedXML( 'c', '영화', true, 0, lastRowIndex )); // returnXMLStr 은 그리드 전체에서 c컬럼의 값이 "영화" 인 행의 데이터 XML 문자열.

getModifiedData( )

변경(삽입, 갱신, 삭제) 행들의 데이터를 배열로 반환합니다.

Return
type	description
Object	변경(삽입, 갱신, 삭제) 행들의 데이터 배열 (2차원 배열)

Sample

var returnArr = grid1.getModifiedData(); // returnArr는 갱신, 삽입, 삭제 상태(1,2,3, U,C,D)의 행들의 데이터 배열.

getModifiedIndex( )

추가나 삭제 상태인 행의 번호를 배열로 반환합니다.

Return
type	description
Object	추가나 삭제 상태인 행의 번호의 배열

Sample

var returnArr = grid1.getModifiedIndex(); // returnArr는 갱신, 삽입, 삭제 상태(1,2,3, U,C,D)의 행들의 배열.

getModifiedXML( )

변경(삽입, 갱신, 삭제) 행들의 데이터를 XML로 반환합니다.

Return
type	description
Xml Element	변경(삽입, 갱신, 삭제) 행들의 데이터 XML

Sample

var returnXML = grid1.getModifiedXML(); // returnXML 은 갱신, 삽입, 삭제 상태(1,2,3, U,C,D)의 행들의 데이터 XML.

getOpacity( )

CSS로 정의 된 컴포넌트의 Opacity(불투명도) 값을 반환한다.

Return
type	description
Integer	Opacity 값

Sample

//아래와 같이 input 컴포넌트에 opcacity css를 적용 한 경우 <xf:input id="input1" style="position: relative;width: 144px;height: 21px;opacity:0.2;"></xf:input> var returnValue = input1.getOpacity(); // returnValue는 0~1사이의 실수이다. //return 예시 ) "0.2"

getOpenStatus( rowIndex )

rowIndex에 해당하는 행의 drilldown이 열려있는지 닫혀있는지 여부를 boolean으로 반환합니다.

Parameter
name	type	required	description
rowIndex	Number	Y	openStatus를 가져오려는 행의 번호

Sample

var rowIdx = 0; grid1.getOpenStatus(rowIdx); // 해당 rowIdx가 그리드에 존재하는 경우, 해당 행의 openStatus값을 반환한다.

getOriginalCellData( rowIndex , colIndex )

rowIndex와 colIndex에 해당하는 셀의 데이터를 반환합니다.

Parameter
name	type	required	description
rowIndex	Number	Y	셀의 초기 행 번호
colIndex	String	Y	셀의 초기 컬럼 번호 혹은 컬럼의 아이디

Return
type	description
String	rowIndex와 colIndex에 해당하는 셀의 데이터

Sample

var returnValue = grid1.getOriginalCellData(0, "a"); // 초기의 첫 번째 row, "a" column에 해당하는 cell의 displayFormat이 적용되지 않은 실제 데이터를 반환

getOverflowX( )

그리드의 overflowX의 설정을 반환합니다.

Return
type	description
String	현재 그리드의 overflowX의 설정

Sample

var returnValue = grid1.getOverflowX(); // returnValue 값은 현재 그리드의 overflowX 설정 값
overflowX 속성값을 설정하지 않은 경우는 기본값은 auto이다.

getOverflowY( )

그리드의 overflowY의 설정을 반환합니다.

Return
type	description
String	현재 그리드의 overflowY의 설정

Sample

var returnValue = grid1.getOverflowY(); // returnValue 값은 현재 그리드의 overflowY 설정 값
overflowY 속성값을 설정하지 않은 경우는 기본값은 auto이다.

getPluginName( )

웹스퀘어 컴포넌트의 pluginName(컴포넌트명)을 반환한다.

Return
type	description
String	웹스퀘어 컴포넌트의 pluginName

Sample

//아래와 같이 공통 function에서 동적으로 웹스퀘어 객체를 받았을 때 컴포넌트의 종류에 따른 분기처리를 할수 있다. var commObj = {}; commObj.fn_makeReqData = function(tmpObj){ var tmpID = tmpObj.getID(); //컴포넌트 ID var tmpCompType = tmpObj.getPluginName(); //컴포넌트 종류 if(tmpCompType == "input"){ //..로직.. }else if(tmpCompType == "gridView"){ //..로직 .. }else{ //..로직.. } };

getPosition( positionName )

컴포넌트의 left 또는 top의 위치 값을 반환한다. %로 설정된 경우, 픽셀로 변환하여 반환한다.

Parameter
name	type	required	description
positionName	String	Y	[left,top]위치 종류

Return
type	description
Number	컴포넌트의 위치 값

Sample

//아래와 같이 input 컴포넌트에 margin css를 적용했을 경우 <xf:input id="input1" style="position: relative;width: 144px;height: 21px;margin:10px;"></xf:input> var returnValue = input1.getPosition("top"); // returnValue는 픽셀 단위의 위치 값이다. //return 예시 ) 10

getRangeData( from , to )

from부터 to-1 까지의 범위의 행의 data를 배열로 반환합니다.

Parameter
name	type	required	description
from	Number	Y	데이터를 가져오는 것을 시작할 행 번호
to	Number	Y	데이터를 가져오는 것을 끝낼 행 번호

Return
type	description
Object	범위안의 data를 가지고 있는 배열 (1차원 배열)

Sample

getRangeXML( from , to )

from부터 to-1 까지의 범위의 행의 data를 xml로 반환합니다.

Parameter
name	type	required	description
from	Number	Y	데이터를 가져오는 범위의 시작 행 번호
to	Number	Y	데이터를 가져오는 범위의 끝 행 번호

Return
type	description
Xml Element	rowIndex에 해당하는 행의 xml데이터

Sample

// id가 a,b,c,d,e인 5개 컬럼이 존재하는 그리드에서 a컬럼의 dataType이 date이고 b컬럼의 dataType이 number이며 각각의 displayFormat이 yyyy.MM.dd, #,###인 경우. // 첫번째 행의 각 컬럼의 데이터는 다음과 같다. ( 20120101 , 23456 , Inswave , WebSquare , sample ) var returnXMLStr = WebSquare.xml.indent(grid1.getRangeXML(0, 1)); baseNode : gridData , repeatNode : vector , valueNode : value 일 경우, returnXMLStr은 다음과 같다. <gridData> <vector status="0" statusValue="R" id="0"> <a value = "20120101"/> <b value = "23456"/> <c value = "Inswave"/> <d value = "WebSquare"/> <e value = "sample"/> </vector> </gridData>

getReadOnly( type , rowIndex , colIndex )

type에 따라 readOnly 속성을 반환합니다.

Parameter
name	type	required	description
type	String	Y	readOnly 속성을 가져올 type (grid, row, column, cell, all 총 5개)
rowIndex	Number	Y	readOnly속성을 가져올 행 번호
colIndex	Number	Y	readOnly속성을 가져올 열 번호

Return
type	description
Boolean	해당 type에 적용된 readOnly속성값

Sample

var returnValue = grid1.getReadOnly("grid"); // returnValue는 그리드 전체에 적용된 readOnly값. var returnValue = grid1.getReadOnly("row", 0); // returnValue는 첫번째 행에 적용된 readOnly값. var returnValue = grid1.getReadOnly("cell", 0, 4); // returnValue는 첫번째 행의 다섯번째 열의 셀에 적용된 readOnly값. var returnValue = grid1.getReadOnly("all", 0, 4); // returnValue는 첫번째 행의 다섯번째 열의 셀에 최종적으로 적용된 readOnly값.

getRealRowIndex( rowIndex )

rowIndex에 대한 실제 데이터의 rowIndex를 리턴한다.

Parameter
name	type	required	description
rowIndex	Number	Y	현재 표시되고 있는 셀의 행 번호

Sample

grid1.getRealRowIndex(3); // 3번째 row에 대한 실제 rowIndex를 리턴한다.

getRowBackgroundColor( rowIndex )

rowIndex에 해당하는 행의 배경색을 반환합니다.

Parameter
name	type	required	description
rowIndex	Number	Y	배경색을 반환할 행 번호

Return
type	description
String	해당 행에 지정된 배경색

Sample

var returnValue = grid1.getRowBackgroundColor(0); // returnValue는 첫번째 행의 배경색.

getRowColor( rowIndex )

rowIndex에 해당하는 행의 글자색을 반환합니다.

Parameter
name	type	required	description
rowIndex	Number	Y	글자색을 반환할 행 번호

Return
type	description
String	행당 행의 글자색

Sample

var returnValue = grid1.getRowColor(0); // returnValue는 첫번째 행의 글자색.

getRowCount( )

그리드의 데이터 row의 건수를 반환합니다.

Return
type	description
Number	그리드의 데이터 row의 건수

Sample

var returnValue = grid1.getRowCount(); // 그리드 data의 row수가 20인 경우, returnValue는 20이다.

getRowData( rowIndex , display )

rowIndex에 해당하는 행의 데이터를 배열로 반환합니다.

Parameter
name	type	required	description
rowIndex	Number	Y	데이터를 가져올 행 번호
display	String	N	값이 displayData인 경우에 화면에 보이는 값으로 반환

Return
type	description
Object	rowIndex에 해당하는 행의 데이터의 배열

Sample

// id가 a,b,c,d,e인 5개 컬럼이 존재하는 그리드에서 a컬럼의 dataType이 date이고 b컬럼의 dataType이 number이며 각각의 displayFormat이 yyyy.MM.dd, #,###인 경우. // 첫번째 행의 각 컬럼의 데이터는 다음과 같다. ( 20120101 , 23456 , Inswave , WebSquare , sample ) var dataArr = grid1.getRowData( 0, 'displayData' ); // dataArr.length 는 5이다. // dataArr[0] 은 2012.01.01 // dataArr[1] 은 23,456 // 위와 같이 format이 지정된 형태의 값으로 반환. var dataArr = grid1.getRowData( 0 ); // dataArr[0] 은 20120101 // dataArr[1] 은 23456 // 위와 같이 원래 값을 반환.

getRowDisabled( rowIndex )

rowIndex에 해당하는 행에 적용된 disabled속성 값을 반환합니다.

Parameter
name	type	required	description
rowIndex	Number	Y	disabled속성을 가져올 행 번호

Return
type	description
Boolean	해당 행에 적용된 disabled속성값

Sample

var returnValue = grid1.getRowDisabled(0); // returnValue는 첫번째 행에 적용된 disabled 값.

getRowIndexByStatus( statusStr )

statusStr과 상태가 일치하는 행의 번호를 배열로 반환합니다.

Parameter
name	type	required	description
statusStr	String	Y	상태가 일치하는 행을 찾기 위한 문자열

Return
type	description
Object	statusStr과 상태가 일치하는 행의 번호의 배열

Sample

var returnArr = grid1.getRowIndexByStatus('CUD'); // returnArr 는 그리드에서 삽입, 갱신, 삭제 상태인 행들의 rowIndex 배열.

getRowReadOnly( rowIndex )

rowIndex에 해당하는 행에 적용된 readonly속성 값을 반환합니다.

Parameter
name	type	required	description
rowIndex	Number	Y	readonly속성을 가져올 행 번호

Return
type	description
Boolean	해당 행에 적용된 readonly속성값

Sample

var returnValue = grid1.getRowReadOnly(0); // returnValue는 첫번째 행에 적용된 readOnly값.

getRowStatus( rowIndex )

rowIndex에 해당하는 행의 상태를 반환합니다. (초기상태:"R", 갱신:"U", 삽입:"C", 삭제:"D", 삽입 후 삭제:"V")

Parameter
name	type	required	description
rowIndex	Number	Y	상태를 반환할 행 번호

Return
type	description
String	행의 상태를 나타내는 문자 (초기상태:"R", 갱신:"U", 삽입:"C", 삭제:"D", 삽입 후 삭제:"V")

Sample

var returnValue = grid1.getRowStatus(0); // 첫 번째 행의 rowStatus 값(문자)를 반환한다.

getRowStatusValue( rowIndex )

rowIndex에 해당하는 행의 상태를 숫자로 반환합니다. (초기상태:0, 갱신:1, 삽입:2, 삭제:3, 삽입 후 삭제:4)

Parameter
name	type	required	description
rowIndex	Number	Y	상태를 반환할 행 번호

Return
type	description
Number	행의 상태를 나타내는 숫자 (초기상태:0, 갱신:1, 삽입:2, 삭제:3, 삽입 후 삭제:4)

Sample

var returnValue = grid1.getRowStatusValue(0); // 첫 번째 행의 rowStatus 값(숫자)를 반환한다.

getRowXML( rowIndex )

rowIndex에 해당하는 행의 data를 XML로 반환합니다.

Parameter
name	type	required	description
rowIndex	Number	Y	데이터를 가져올 행 번호

Return
type	description
XML Element	행의 XML 데이터

Sample

// id가 a,b,c,d,e인 5개 컬럼이 존재하는 그리드에서 a컬럼의 dataType이 date이고 b컬럼의 dataType이 number이며 각각의 displayFormat이 yyyy.MM.dd, #,###인 경우. // 첫번째 행의 각 컬럼의 데이터는 다음과 같다. ( 20120101 , 23456 , Inswave , WebSquare , sample ) var returnXMLStr = WebSquare.xml.indent(grid1.getRowXML(0)); baseNode : gridData , repeatNode : vector , valueNode : value 일 경우, returnXMLStr은 다음과 같다. <vector status="0" statusValue="R" id="0"> <a value = "20120101"/> <b value = "23456"/> <c value = "Inswave"/> <d value = "WebSquare"/> <e value = "sample"/> </vector>

getSize( sizeName )

컴포넌트의 크기 값을 반환합니다.%로 설정된 경우, 픽셀로 변환하여 반환한다.

Parameter
name	type	required	description
sizeName	String	Y	[height,innerHeight,outerHeight,outerMarginHeight,width,innerWidth,outerWidth,outerMarginWidth]크기 값의 종류. szieName별 계산 방법은 아래를 참고.

Return
type	description
Number	컴포넌트의 크기 값

Sample

var returnValue = componentId.getSize("width"); // returnValue는 픽셀 단위의 크기 값이다. %로 설정된 경우, 픽셀로 변환하여 반환한다. //return 예시 ) 100

getSortableArr( )

header의 각 컬럼이 sortable한지 여부를 array로 반환한다.

Return
type	description
Boolean	각 컬럼의 sortable 여부

getSortableStatus( )

sorting된 컬럼의 순서대로 해당 컬럼의 header 정보를 담은 object를 array로 반환한다. sorting된 컬럼이 없을 경우 빈 array를 반환한다.
반환된 array의 각 object는 colID, dataType, sortOrder를 담고 있으며 sortOrder가 1인 경우 오름정렬이고, -1인 경우는 내림정렬이다.

Return
type	description
Object	sorting된 header의 정보

getStyle( propertyName )

컴포넌트에 적용 된 CSS의 propertyName에 해당하는 값을 반환한다.

Parameter
name	type	required	description
propertyName	String	Y	반환 할 style의 property 이름

Return
type	description
String	style의 속성값

Sample

//아래와 같이 input 컴포넌트가 정의 된 경우 <xf:input id="input1" style="position: relative;width: 144px;height: 21px;"></xf:input> var returnValue = input1.getStyle("width"); //return 예시 ) "144px"

getStyleValue( style )

[deprecated]getStyle로 사용.
컴포넌트에 적용 된 CSS의 propertyName에 해당하는 값을 반환한다.

Parameter
name	type	required	description
style	String	Y	정의 된 style에서 사용자가 반환 받고자하는 속성명.

Return
type	description
String	style 속성에 정의 된 값(색을 반환하는 경우에는 색HexCode로 반환)

getTitle( )

title 속성값을 반환한다.

Return
type	description
String	title 속성값.

Sample

//아래와 같이 input 컴포넌트에 title이 정의 된 경우 <xf:input id="input1" style="position: relative;width: 144px;height: 21px;" title="이름 입력"></xf:input> var tmpTitle = input1.getTitle(); //return 예시 ) "이름 입력"

getTopRowIndex( )

현재 그리드에 그려진 최상단 row의 rowIndex를 반환합니다. 그려진 row가 없으면 -1을 반환합니다.

Return
type	description
Number	최상단 row의 rowIndex

Sample

var returnValue = grid1.getTopRowIndex(); // returnValue는 스크롤 변화에 따라 현재 그리드에 보이는 최상단 행의 index.

getTotalCol( )

컬럼의 개수를 반환 한다.

Return
type	description
Number	컬럼의 개수

getTotalRow( )

행의 개수를 반환 한다.

Return
type	description
Number	행의 개수

getUncheckedData( colIndex )

colIndex에 해당하는 열이 radio/checkbox일 경우 uncheck된 행의 data를 XML로 반환합니다.

Parameter
name	type	required	description
colIndex	Number	Y	ckeckbox여부를 검사할 열번호 혹은 컬럼 아이디

Return
type	description
Object	data를 저장한 배열

Sample

var returnArr = grid1.getUncheckedData('a'); // returnArr는 'a' 컬럼 중 선택되지 않은 행의 데이터 배열.

getUncheckedIndex( colIndex )

colIndex에 해당하는 열의 radio/checkbox가 uncheck된 행의 Index를 배열로 반환합니다.

Parameter
name	type	required	description
colIndex	Number	Y	ckeckbox여부를 검사할 열번호 혹은 컬럼 아이디

Return
type	description
Object	행번호를 저장한 배열

Sample

var returnArr = grid1.getUncheckedIndex('a'); // returnArr는 선택되지 않은 행의 index 배열.

getUncheckedXML( colIndex )

colIndex에 해당하는 열의 radio/checkbox가 uncheck된 행의 data를 XML로 반환합니다.

Parameter
name	type	required	description
colIndex	Number	Y	ckeckbox여부를 검사할 열번호 혹은 컬럼 아이디

Return
type	description
Xml element	data를 저장한 XML

Sample

var returnXML = grid1.getUncheckedXML('a'); // returnXML 은 'a' 컬럼 중 선택되지 않은 행들의 데이터 XML 문자열.

getUnmatchedColumnData( matchCol , dataValue , targetCol , exactMatch , stRowIndex , lastRowIndex )

stRowIndex부터 lastRowIndex-1 까지의 범위의 행중에서 colIndex의 값이 dataValue와 다른 행들을 찾아서 targetCol에 해당하는 열의 값들을 배열로 반환합니다.

Parameter
name	type	required	description
matchCol	Number	Y	데이터를 검사할 열번호 혹은 컬럼 아이디
dataValue	String	Y	colIndex해당하는 열의 값과 비교할 data
targetCol	Number	Y	데이터를 가져올 열번호
exactMatch	Boolean	Y	정확히 일치하는지 여부
stRowIndex	Number	Y	데이터를 가져오는 것을 시작할 행 번호
lastRowIndex	Number	Y	데이터를 가져오는 것을 끝낼 행 번호

Return
type	description
Object	targetCol에 해당하는 열의 값을 가지고 있는 배열 (1차원 배열)

Sample

var lastRowIndex = grid1.getRowCount() ; var returnArr = grid1.getUnmatchedColumnData( 'c', '영화', 'd', true, 0, lastRowIndex); // returnArr는 c컬럼의 값이 '영화'가 아닌 컬럼의 행 index에 해당하는 d컬럼의 데이터 배열.

getUnmatchedData( colIndex , dataValue , exactMatch , stRowIndex , lastRowIndex )

stRowIndex부터 lastRowIndex-1 까지의 범위의 행중에서 colIndex의 값이 dataValue와 다른 행들의 data를 배열로 반환합니다.

Parameter
name	type	required	description
colIndex	Number	Y	데이터를 검사할 열번호 혹은 컬럼 아이디
dataValue	String	Y	colIndex해당하는 열의 값과 비교할 data
exactMatch	Boolean	Y	정확히 일치하는지 여부
stRowIndex	Number	Y	데이터를 가져오는 것을 시작할 행 번호
lastRowIndex	Number	Y	데이터를 가져오는 것을 끝낼 행 번호

Return
type	description
Object	범위안에 일치하는 data를 가지고 있는 배열 (2차원 배열)

Sample

var lastRowIndex = grid1.getRowCount(); var returnArr = grid1.getUnmatchedData( 'c', '영화', true, 0, lastRowIndex ); // returnArr는 그리드 전체에서 c컬럼의 값이 "영화" 가 아닌 행의 데이터 배열.

getUnmatchedIndex( colIndex , dataValue , exactMatch , stRowIndex , lastRowIndex )

stRowIndex부터 lastRowIndex-1 까지의 범위의 행중에서 colIndex의 값이 dataValue와 다른 행들의 index를 배열로 반환합니다.

Parameter
name	type	required	description
colIndex	Number	Y	데이터를 검사할 열번호 혹은 컬럼 아이디
dataValue	String	Y	colIndex해당하는 열의 값과 비교할 data
exactMatch	Boolean	Y	정확히 일치하는지 여부
stRowIndex	Number	Y	데이터를 가져오는 것을 시작할 행 번호
lastRowIndex	Number	Y	데이터를 가져오는 것을 끝낼 행 번호

Return
type	description
Object	범위안에 일치하는 index를 가지고 있는 배열

Sample

var lastRowIndex = grid1.getRowCount(); var returnArr = grid1.getUnmatchedIndex( 'c', '영화', false, 0, lastRowIndex ); // returnArr는 그리드 전체에서 c컬럼의 값이 "영화"를 포함하고 있지 않는 행 Index의 배열.

getUnmatchedXML( colIndex , dataValue , exactMatch , stRowIndex , lastRowIndex )

stRowIndex부터 lastRowIndex-1 까지의 범위의 행중에서 colIndex의 값이 dataValue와 다른 행들의 data를 Xml로 반환합니다.

Parameter
name	type	required	description
colIndex	Number	Y	데이터를 검사할 열번호 혹은 컬럼 아이디
dataValue	String	Y	colIndex해당하는 열의 값과 비교할 data
exactMatch	Boolean	Y	정확히 일치하는지 여부
stRowIndex	Number	Y	데이터를 가져오는 것을 시작할 행 번호
lastRowIndex	Number	Y	데이터를 가져오는 것을 끝낼 행 번호

Return
type	description
Xml element	범위안에 일치하는 index를 가지고 있는 Xml

Sample

var lastRowIndex = grid1.getRowCount(); var returnXMLStr = WebSquare.xml.indent(grid1.getUnmatchedXML( 'c', '영화', true, 0, lastRowIndex )); // returnXMLStr 은 그리드 전체에서 c컬럼의 값이 "영화" 가 아닌 행의 데이터 XML 문자열.

getUpdatedData( )

갱신 상태인 행들의 데이터를 배열로 반환합니다.

Return
type	description
Object	갱신 상태인 행들의 데이터 배열 (2차원 배열)

Sample

var returnArr = grid1.getUpdatedData(); // returnArr는 갱신 상태(1, U)의 행들의 데이터 배열.

getUpdatedIndex( )

갱신 상태인 행의 번호를 배열로 반환합니다.

Return
type	description
Object	갱신 상태인 행의 번호의 배열

Sample

var returnArr = grid1.getUpdatedIndex(); // returnArr는 갱신 상태(1, U)의 행들의 배열.

getUpdatedXML( )

갱신 상태인 행들의 데이터를 XML로 반환합니다.

Return
type	description
Xml Element	갱신 상태인 행들의 데이터 XML

Sample

var returnXMLStr = WebSquare.xml.indent(grid1.getUpdatedXML()); // returnXMLStr 은 갱신 상태(1, U)의 행들의 데이터 XML 문자열.

getUserData( key )

setUserData API로 설정 된 사용자 데이터 또는 소스(화면 XML)에 사용자가 임의의 property로 정의 된 값을 반환한다.

Parameter
name	type	required	description
key	String	Y	임의 데이터의 키

Return
type	description
String	key에 해당하는 데이터

Sample

//아래와 같이 input 컴포넌트의 사용자 속성(eduTest)이 적용 된 경우. <xf:input id="input1" style="position: relative;width: 144px;height: 21px;" eduTest="Hello"></xf:input> input1.getUserData("eduTest"); //return 예시 ) "Hello" //setUserData를 통해 set한 경우 input1.setUserData("eduTest","WebSquare"); input1.getUserData("WebSquare"); //return 예시 ) "Hello"

getVisibleColData( colIndex )

colIndex에 해당하는 열의 화면에 보이는(filter나 sort처리된) 데이터를 배열로 반환합니다.

Parameter
name	type	required	description
colIndex	Number	Y	데이터를 가져올 열 번호 혹은 컬럼 아이디

Return
type	description
Object	colIndex에 해당하는 열의 화면에 보이는 데이터의 배열

Sample

var returnArr = grid1.getVisibleColData('a'); // returnArr는 'a' 컬럼의 데이터 배열으로 filter나 sort처리가 되어 있을 경우, 'a' 컬럼의 getColData('a') 데이터와 차이가 있을 수 있음.

getVisibleRowNum( )

현재 그리드에 그려진 row의 수를 반환합니다. (subtotal은 제외)

Return
type	description
Number	현재 그려진 row의 수

Sample

var returnValue = grid1.getVisibleRowNum(); // returnValue는 현재 그리드에 그려진(보이는) 행의 수

hasClass( className )

컴포넌트가 parameter로 받은 className의 class를 가지고 있는지의 여부를 반환한다.

Parameter
name	type	required	description
className	String	Y	검색 할 className

Return
type	description
Boolean	class를 가지고 있는지의 여부

Sample

//아래와 같이 input 컴포넌트에 class가 정의 된 경우 <xf:input id="input1" style="position: relative;width: 144px;height: 21px;" class="tmpInputClass"></xf:input> var returnValue = input1.hasClass("tmpInputClass"); //return 예시 ) true

hide( )

컴포넌트를 화면에서 보이지 않도록 숨긴다.
엔진 내부적으로는 CSS를 display:none;과 visibility:hidden;으로 처리한다.

Sample

componentId.hide();

initGrid( )

실행중인 그리드를 초기화 합니다. 전체 데이터 삭제 후, 필터처리, 컬럼 기본정보(selectbox의 nodeset 등)를 초기화 합니다.

Sample

grid1.initGrid();

insertRow( rowIndex )

rowIndex에 해당하는 행에 새로운 행을 삽입합니다.

Parameter
name	type	required	description
rowIndex	Number	Y	행을 새로 삽입할 행번호

Sample

grid1.insertRow(0); // 첫번째 행에 새로운 행을 삽입한다.

isEditing( )

그리드가 현재 편집중 인지 여부를 반환합니다.

Return
type	description
Boolean	그리드가 현재 편집중 인지 여부

modifyAllStatus( status )

모든 행의 상태를 status으로 변경 합니다.

Parameter
name	type	required	description
status	String	Y	변경할 상태 (초기상태:"R", 갱신:"U", 삽입:"C", 삭제:"D", 삽입 후 삭제:"V"). status값 변경으로 데이터를 조작할 수 없는 것이 원칙이므로 "E"는 인자값으로 사용할 수 없음.

Sample

grid1.modifyAllStatus('D'); // 모든 행을 삭제 상태로 변경한다.

modifyCheckedStatus( col , status )

col에 해당하는 열의 checkbox가 check된 행의 상태를 상태로 변경합니다.

Parameter
name	type	required	description
col	String	Y	ckeckbox를 검사할 열 번호 혹은 컬럼 아이디
status	String	Y	변결할 상태

Sample

grid1.modifyCheckedStatus('a','D'); // 'a' 컬럼(checkbox)에서 선택된 행들을 삭제 상태로 변경한다.

modifyMatchedStatus( colIndex , data , status )

col에 해당하는 열의 값과 data가 일치된 행의 상태를 status로 변경합니다.

Parameter
name	type	required	description
colIndex	Number	Y	검사할 열 번호
data	String	Y	일치하는지를 검사할 값
status	String	Y	변경할 상태. status값 변경으로 데이터를 조작할 수 없는 것이 원칙이므로 "E"는 인자값으로 사용할 수 없음.

Sample

grid1.modifyMatchedStatus('c', '영화', 'U'); // c 컬럼의 값이 '영화'인 행들의 상태를 갱신 상태로 변경한다.

modifyRangeStatus( from , to , status )

from부터 to까지의 범위의 행들의 상태를 param으로 입력받은 상태로 변경 합니다.

Parameter
name	type	required	description
from	Number	Y	변경할 범위의 시작 행번호
to	Number	Y	변경할 범위의 끝 행호
status	String	Y	변경할 상태. status값 변경으로 데이터를 조작할 수 없는 것이 원칙이므로 "E"는 인자값으로 사용할 수 없음.

Sample

grid1.modifyRangeStatus(1 , 3, 'D'); // 두번째, 세번째 행을 삭제 상태로 변경한다.

modifyRowStatus( rowIndex , status )

rowIndex에 해당하는 행의 상태를 param으로 입력받은 상태로 변경 합니다.

Parameter
name	type	required	description
rowIndex	Number	Y	상태를 변경할 행 번호
status	String	Y	변경할 상태. status값 변경으로 데이터를 조작할 수 없는 것이 원칙이므로 "E"는 인자값으로 사용할 수 없음.

Sample

grid1.modifyRowStatus(0, 'D'); // 첫번째 행을 삭제 상태로 변경한다.

modifyUncheckStatus( col , status )

col에 해당하는 열의 checkbox가 uncheck된 행의 상태를 status로 변경합니다.

Parameter
name	type	required	description
col	String	Y	ckeckbox를 검사할 열 번호 혹은 컬럼 아이디
status	String	Y	변결할 상태

Sample

grid1.modifyUncheckStatus('a','D'); // 'a' 컬럼(checkbox)에서 선택되지 않은 행들을 삭제 상태로 변경한다.

multisort( options )

option에 따라서 여러개의 열을 동시에 정렬해줍니다.

Parameter
name	type	required	description
options	Object	Y	정렬에 대한 옵션을 JSON형식으로 가지고 있는 object

Sample

var options = {}; options.sortIndex = "category member"; options.sortOrder = "1 1"; grid1.multisort( options ); category컬럼의 카테고리를 먼저 오름차순으로 정렬 한 후, 동일 분류에 대하여 member컬럼의 회원 수를 오름차순으로 정렬한다. multisort의 경우, dataType을 고려한 정렬이 가능하다.

readCSV( options )

csv 파일을 읽어 그리드의 데이터를 설정합니다. (JDK 1.5이상에서 사용 가능)

Parameter
name	type	required	description
options	Object	Y	JSON형태로 저장된 그리드의 csv 업로드 옵션

Sample

var options = { type: "1", delim: ",", escapeChar: "'", startRowIndex: 1, append: "0", hidden: "0", fillHidden: "0", skipSpace: "1" }; grid1.readCSV(options);

redrawColumn( colIndex , valid )

colIndex에 해당하는 열을 다시 그려줍니다.

Parameter
name	type	required	description
colIndex	String	Y	셀의 열의 Column id 또는 index
valid	Boolean	N	cell의 inputtype이 select인 경우 selectbox와 cell의 value의 적합성에 따라 데이터를 처리 유무(default:true)

Sample

grid1.redrawColumn('c'); // c컬럼을 다시 그린다.

reform( )

그리드의 originalData를 현재의 데이터로 바꿔주고 모든 행의 상태를 초기화합니다.

Sample

grid1.reform(); // 모든 행의 상태가 초기상태 (0, R)로 변경된다.

refreshColumnItemset( colIndex )

colIndex에 해당하는 열의 itemset을 갱신합니다. inputType이 select인 경우에만 동작합니다.

Parameter
name	type	required	description
colIndex	String	Y	갱신할 column의 id 또는 index

Sample

// id가 grade인 컬럼의 inputType이 select인 경우. grid1.refreshColumnItemset('grade'); // grid의 select 컬럼이 참조하는 itemSet이 변경된 경우, grid에 다시 반영한다.

removeAll( )

그리드의 모든 행을 삭제하고 가지고 있던 data를 반환합니다.

Return
type	description
Object	삭제한 행들이 가지고 있던 data

Sample

// 5개의 컬럼이 존재하는 그리드에서 행의 수가 20개 인 경우. var returnArr = grid1.removeAll(); // returnArr는 1차원 배열이며, returnArr.length 는 100이다.

removeClass( className )

컴포넌트에 className의 class를 삭제한다.
기본 설정은 addClass API를 통해 추가 된 class만 적용되며 컴포넌트의 class 속성에 직접 정의 된 class를 삭제해야하는 경우는 config.xml파일의 설정을 아래와 같이 적용해야한다.
<style><removeDefaultClass value="true" /></style>

Parameter
name	type	required	description
className	String	Y	삭제 할 class명

Sample

removeColumnFilter( colIndex )

colIndex에 해당하는 열에 적용된 filter를 삭제합니다.

Parameter
name	type	required	description
colIndex	Number	Y	filter를 삭제할 열 번호 혹은 컬럼 아이디

Sample

grid1.removeColumnFilter( 'c' ); // c컬럼에 적용된 필터링을 해제한다. 여러 컬럼에 setColumnFilter를 사용한 경우, 해제되지 않는 filter의 operationType에 유의하여야 한다.

removeColumnFilterAll( )

모든 열에 적용된 filter를 삭제합니다.

Sample

grid1.removeColumnFilterAll(); // 전체 필터링을 해제한다.

removeFocusedCell( )

그리드의 셀에 지정되어 있는 모든 포커스를 제거한다

Sample

grid1.removeFocusedCell(); // 그리드의 포커스를 제거한다

removeRange( startIdx , endIdx )

startIdx와 endIdx사이의 그리드의 모든 행을 삭제하고 가지고 있던 data를 반환합니다.

Parameter
name	type	required	description
startIdx	Number	Y	데이터를 삭제할 범위의 시작 행
endIdx	Number	Y	데이터를 삭제할 범위의 끝 행

Return
type	description
Object	삭제된 범위 사이의 데이터 2차원 배열

Sample

// 5개 컬럼이 존재하는 그리드. var returnArr = grid1.removeRange(0, 1); // returnArr.length는 2이다. // returnArr[0].length는 5이다. // returnArr[0][0] 은 첫 번째 행의 첫 번째 컬럼의 값. // returnArr[1][0] 은 두 번째 행의 첫 번째 컬럼의 값.

removeRow( rowIndex )

rowIndex에 해당하는 행을 삭제하고 가지고 있던 data를 반환합니다.

Parameter
name	type	required	description
rowIndex	Number	Y	삭제할 행 번호

Return
type	description
Object	삭제한 행이 가지고 있던 data배열

Sample

var returnArr = grid1.removeRow(0); // 첫 번째 행을 삭제한다. // returnArr.length는 5이고, returnArr[0]은 첫 번째 셀의 값이 된다.

removeRows( rowIndexArr )

rowIndexArr배열에 저장된 index에 해당하는 행들을 삭제하고 가지고 있던 data들을 반환합니다.

Parameter
name	type	required	description
rowIndexArr	Object	Y	삭제할 행들의 번호를 저장하는 배열

Return
type	description
Object	삭제한 행들이 가지고 있던 data(2차원 배열)

Sample

// "a" 컬럼은 inputType이 checkbox이며 첫 번째, 세 번째 행이 선택되어 있는 상태 var rmArr = grid1.getCheckedIndex('a'); var returnArr = grid1.removeRows(rmArr); // rmArr[0] = 0 이고, rmArr[1] = 2이다. // returnArr.length는 2이다. // returnArr[0].length는 5이다. // returnArr[0][0]은 첫 번째 행의 첫 번째 컬럼의 값. // returnArr[1][0]은 세 번째 행의 첫 번째 컬럼의 값.

rowMoveDown( rowIndex )

rowIndex에 해당하는 행을 하나 아래로 내려줍니다.

Parameter
name	type	required	description
rowIndex	Number	Y	하나 아래로 내려줄 행 번호

Sample

grid1.rowMoveDown(1); // 두 번째 행(rowIndex = 1)을 한 칸 아래로 이동, 즉 두 번째 행과 세 번째 행의 위치가 뒤바뀜

rowMoveUp( rowIndex )

rowIndex에 해당하는 행을 하나 위로 올려줍니다.

Parameter
name	type	required	description
rowIndex	Number	Y	하나 위로 올려줄 행 번호

Sample

grid1.rowMoveUp(1); // 두 번째 행(rowIndex = 1)을 한 칸 위로 이동, 즉 첫 번째 행과 두 번째 행의 위치가 뒤바뀜

saveCSV( options )

그리드의 데이터를 CSV 파일로 저장합니다. (JDK 1.5이상에서 사용 가능)

Parameter
name	type	required	description
options	Object	Y	JSON형태로 저장된 그리드의 csv 다운로드 옵션

Sample

var colArr = []; colArr[0] = "name"; colArr[1] = "corp"; var options = { fileName: "saveCSV.csv", type: "1", delim: ";", saveList: colArr }; grid1.saveCSV(options);

setAutoFit( options )

그리드의 사이즈에 맞게 컬럼의 크기를 변경하여 꽉차게 그려줍니다. autoFit옵션이 lastColumn경우 마지막 컬럼의 폭만 변경이 되고, allColumn이면 전체 컬럼을 폭을 균일하게 변경합니다.

Parameter
name	type	required	description
options	Object	N	JSON형태로 저장된 그리드의 setAutoFit 옵션

Sample

var options = { type : "allColumn", minWidth : 480 } grid1.setAutoFit( options ); grid의 width가 480px보다 작아질 경우에는 각 컬럼의 width의 함은 480px로 고정되며, 480px에 맞게 각 컬럼 width가 변경. grid의 width가 480px보다 큰 경우는 grid의 width에 맞게 각 컬럼 width가 변경.

setBottomRowIndex( bottomRowIndex )

그리드의 세로 스크롤 위치를 이동하여 최하단에 bottomRowIndex 해당하는 row가 위치하도록 조정합니다.

Parameter
name	type	required	description
bottomRowIndex	Number	Y	최하단에 위치할 rowIndex

Sample

grid1.setTopRowIndex(10); // 그리드의 세로 스크롤을 맨 아래로 이동하여 최하단에 rowIndex가 10인 row가 위치하도록 조정

setCaption( htmlStr )

그리드 테이블의 caption의 innerHTML 값을 설정합니다.

Parameter
name	type	required	description
htmlStr	String	Y	caption의 innerHTML 값으로 설정될 값

setCellBackgroundColor( rowIndex , colIndex , color )

rowIndex와 colIndex에 해당하는 셀에 param으로 들어온 color를 배경색으로 설정합니다.

Parameter
name	type	required	description
rowIndex	Number	Y	배경색을 설정할 행 번호
colIndex	String	Y	배경색을 설정할 열 번호 혹은 컬럼 아이디
color	String	Y	배경색으로 설정할 색

Sample

grid1.setCellBackgroundColor(0, 'a', '#0000FF'); // 첫번째 행 a컬럼의 배경색을 파랑으로 설정한다.

setCellChecked( rowIndex , colIndex , dataValue )

rowIndex와 colIndex에 해당하는 셀이 checkbox/radio인 경우 dataValue가 true이면 체크 false이면 uncheck해 줍니다.

Parameter
name	type	required	description
rowIndex	Number	Y	셀의 행의 인덱스
colIndex	String	Y	셀의 열의 Column id 또는 index
dataValue	Boolean	Y	셀의 체크 여부

Sample

grid1.setCellChecked(0,'a',false); // a컬럼 첫번째 행을 체크해제한다.

setCellColor( rowIndex , colIndex , color )

rowIndex와 colIndex에 해당하는 셀에 param으로 들어온 color를 글자색으로 설정합니다.

Parameter
name	type	required	description
rowIndex	Number	Y	글자색을 설정할 행 번호
colIndex	String	Y	글자색을 설정할 열 번호 혹은 컬럼 아이디
color	String	Y	글자색으로 설정할 색

Sample

grid1.setCellColor(0, 'a', '#0000FF'); // 첫번째 행 a컬럼의 글자색을 파랑으로 설정한다.

setCellData( rowIndex , colIndex , data )

rowIndex와 colIndex에 해당하는 셀의 값을 data로 바꿔줍니다.

Parameter
name	type	required	description
rowIndex	Number	Y	셀의 행 번호
colIndex	String	Y	셀의 컬럼 번호 혹은 컬럼의 아이디
data	String	Y	셀에 넣어줄 데이터

Sample

grid1.setCellData(0, "a", data); // 첫 번째 row, "a" column에 해당하는 cell의 값을 data로 바꾼다.

setCellDisabled( rowIndex , colIndex , disabled )

colIndex와 rowIndex에 해당하는 셀의 disabled속성 값을 param으로 들어온 disabled값으로 설정합니다.

Parameter
name	type	required	description
rowIndex	Number	Y	disabled 속성을 설정할 행 번호
colIndex	String	Y	disabled 속성을 설정할 열 번호 혹은 컬럼 아이디
disabled	Boolean	Y	disabled 속성에 적용할 값

Sample

grid1.setCellDisabled(0, 'a', true); // 첫번째 행에서 a컬럼의 disabled 속성을 적용시킨다.

setCellReadOnly( rowIndex , colIndex , readOnly )

colIndex와 rowIndex에 해당하는 셀의 readonly속성 값을 param으로 들어온 readOnly값으로 설정합니다.

Parameter
name	type	required	description
rowIndex	Number	Y	readonly 속성을 설정할 행 번호
colIndex	String	Y	readonly 속성을 설정할 열 번호 혹은 컬럼 아이디
readOnly	Boolean	Y	readonly 속성에 적용할 값

Sample

grid1.setCellReadOnly(0, 'a', true); // 첫번째 행에서 a컬럼의 readOnly속성을 적용시킨다.

setColumnBackgroundColor( colIndex , color )

colIndex에 해당하는 열에 param으로 들어온 color를 배경색으로 설정합니다.

Parameter
name	type	required	description
colIndex	String	Y	배경색을 설정할 열 번호 혹은 컬럼 아이디
color	String	Y	배경색으로 설정할 색

Sample

grid1.setColumnBackgroundColor('a', '#0000FF'); // a컬럼의 배경색을 파랑으로 설정한다.

setColumnColor( colIndex , color )

colIndex에 해당하는 행에 param으로 들어온 color를 글자색으로 설정합니다.

Parameter
name	type	required	description
colIndex	String	Y	글자색을 설정할 열 번호 혹은 컬럼 아이디
color	String	Y	글자색으로 설정할 색

Sample

grid1.setColumnColor('a', '#0000FF'); // a컬럼의 글자색을 파랑으로 설정한다.

setColumnDisabled( colIndex , disabled )

colIndex에 해당하는 열에 disabled속성을 param으로 들어온 disabled로 설정합니다.

Parameter
name	type	required	description
colIndex	String	Y	disabled속성을 설정할 열 번호 혹은 컬럼 아이디
disabled	Boolean	Y	disabled속성에 적용할 값

Sample

grid1.setColumnDisabled('a', true); // a 컬럼의 disabled 속성을 적용시킨다.

setColumnFilter( filterOptions )

colIndex에 해당하는 열에 filter를 적용합니다.

Parameter
name	type	required	description
filterOptions	Object	Y	filter를 적용할 옵션

Sample

예제1) row 필터 //key로 넘어온 문자열에 대해 indexOf를 이용하여 필터링 하는 필터이다. //id가 a,b,c,d,e인 5개 컬럼이 존재하는 그리드. grid1.setColumnFilter( {type:'row', colIndex:'a', key:"영화", condition:'and'}); a컬럼이 "영화"문자가 포함된 행들만 필터링 되어 보인다. 예제2) func 필터 //cellData를 필터링 하여 true/false를 리턴하는 function을 사용자가 구현하여 처리하는 필터이다. //id가 a,b,c,d,e인 5개 컬럼이 존재하는 그리드. grid1.setColumnFilter( {type:'func', colIndex:'a', key:function(cellData, param) { if(cellData.indexOf("영화") > -1) { return true; }else{ return false} }, condition:'and',param:{}}); a컬럼이 "영화"문자가 포함된 행들만 필터링 되어 보인다. 예제3) regExp 필터 //정규표현식을 이용하여 필터링하는 필터이다. //id가 a,b,c,d,e인 5개 컬럼이 존재하는 그리드. grid1.setColumnFilter( {type:'regExp', colIndex:'a', key:/20120101|20120102|20120103/gi, condition:'and'}); a컬럼이 20120101 또는 20120102 또는 20120103을 포함하는 문자열으로 필터링한다. 사용자 정규표현식을 key로 넘겨서 처리할 수 있으며, key는 String이 아닌 regExp로 셋팅하여야 한다.

setColumnOrder( columnOrderArray )

주어진 array를 기준으로 하여 그리드의 컬럼 순서를 재 설정합니다.

Parameter
name	type	required	description
columnOrderArray	Array	Y	컬럼의 순서를 차례로 담은 배열(컬럼 index와 id 모두 사용 가능)

setColumnReadOnly( colIndex , readOnly )

colIndex에 해당하는 열에 readonly속성을 param으로 들어온 readonly로 설정합니다.

Parameter
name	type	required	description
colIndex	String	Y	readonly속성을 설정할 열 번호 혹은 컬럼 아이디
readOnly	Boolean	Y	readonly속성에 적용할 값

Sample

grid1.setColumnReadOnly('a', true); // a 컬럼의 readOnly속성을 적용시킨다.

setColumnVisible( colIndex , colVisible )

주어진 column의 hidden 여부를 설정한다

Parameter
name	type	required	description
colIndex	String	Y	그리드의 hidden 여부를 설정한 column의 ID
colVisible	Boolean	Y	해당 column을 보일지 여부(true인 경우 해당 column을 표시하고 false인 경우는 숨김)

Sample

grid1.setColumnVisible('a', false); // a컬럼을 hidden시킨다.

setColumnWidth( colIndex , size )

지정한 컬럼의 폭을 변경합니다.

Parameter
name	type	required	description
colIndex	String	Y	폭을 변경할 column의 index
size	Number	Y	변경할 컬럼의 폭

Sample

grid1.setColumnWidth("a", 100); // id가 "a"인 컬럼의 width를 100px로 변경한다.

setData( arr , append , columnArr )

1차원 Array형태의 String를 Grid에 추가합니다. (행의 상태는 초기상태인 "R"로 변경됩니다. 데이터의 순서를 지정해주는 columnArr를 사용할 경우, append는 항상 넣어줘야합니다.)

Parameter
name	type	required	description
arr	String	Y	그리드에 넣을 데이터 스트링(소스 안쪽에서 array로 변환)
append	Boolean	N	이어쓰기 여부, false이면 기존 데이터삭제 [true/false] 생략시 false. [생략가능 단, columnArr를 사용할 경우, 생략불가]
columnArr	String	N	컬럼 id 스트링(소스 안쪽에서 array로 변환, 해당 id의 순서로 그리드 데이터가 생성됩니다.)

Sample

그리드에 기존 데이터를 삭제하고 gridDataStr를 추가한다. var gridData ="/image/0001.jpg;해외펜팔카페 Renaissance 입니다.;펜팔, 해외펜팔;23159;RS클레아;#g1;20111114;" +"/image/0002.jpg;RH- 혈액형. 특별한 사람들;RH-, 희귀혈액형;8049;서울 아트;#g2;20070722"; var gridDataStr = gridData.split(";"); grid1.setData(gridDataStr, false); array의 length는 그리드 컬럼의 배수가 되어야 하며, array 순서대로 그리드 데이터가 생성된다. columnArr의 값이 있을 경우, 해당 컬럼의 순서대로 그리드 데이터가 생성된다. grid1.setData(gridDataStr, false, ["col4","col3","col2","col1","col5","col6"]);

setDisabled( type , rowIndex , colIndex , disabled )

해당하는 type의 disabled 속성 값을 param으로 들어온 disabled값으로 설정합니다.

Parameter
name	type	required	description
type	String	Y	disabled 속성을 설정할 type (grid, row, column, cell 총 4개)
rowIndex	Number	Y	disabled 속성을 설정할 행 번호
colIndex	Number	Y	disabled 속성을 설정할 열 번호
disabled	Boolean	Y	disabled 속성에 적용할 값

Sample

grid1.setDisabled("grid", true); // 그리드 전체의 disabled 속성을 true로 적용시킨다. grid1.setDisabled("row", 0, true); // 첫번째 행의 disabled 속성을 true로 적용시킨다. grid1.setDisabled("cell", 0, 4, true); // 첫번째 행에서 다섯번째 열의 cell의 disabled 속성을 true로 적용시킨다.

setDisplayFormat( colIndex , displayFormat )

그리드의 컬럼에 포맷을 설정합니다.

Parameter
name	type	required	description
colIndex	Number	Y	그리드 컬럼의 인덱스
displayFormat	String	Y	컬럼에 적용할 포맷

Sample

grid1.setDisplayFormat("a", "#,###"); // id가 "a"인 컬럼의 format을 "#,###"로 설정

setDisplayFormatter( colIndex , displayFormatter )

그리드의 컬럼에 포맷터 함수를 설정합니다.

Parameter
name	type	required	description
colIndex	Number	Y	그리드 컬럼의 인덱스
displayFormatter	String	Y	컬럼에 적용할 포맷터 함수

Sample

function setBoldFont(value){ return "<i>"+value+"</i>"; } grid1.setDisplayFormatter("a", setBoldFont); // id가 "a"인 컬럼에 italic 효과 추가

setEventPause( evList , flag )

컴포넌트의 이벤트를 disable 또는 enable시킨다.

Parameter
name	type	required	description
evList	String	N	대상 이벤트 목록. 해당 인자가 주어지지 않을 경우 해당 컴포넌트의 모든 사용자 이벤트가 대상이 된다. (null을 지정하면 된다.)
flag	Boolean	Y	true인 경우 pause시키며, false인 경우 pause를 해제한다.

Sample

input1.setEventPause("onclick", true); //onclick이벤트를 동적으로 pause 한다. input1.setEventPause("onfocus,onblur", false); //onfocus이벤트와 onblur이벤트의 pause를 해제한다. input1.setEventPause(null, true); //input에 등록된 모든 사용자 이벤트를 pause 한다.

setFixedColumn( fixedColumn )

고정된 컬럼 영역을 설정합니다.

Parameter
name	type	required	description
fixedColumn	Number	Y	맨 왼쪽부터 시작해서 영역을 고정시킬 컬럼들의 수

Sample

grid1.setFixedColumn(2); // 앞에서 2개 컬럼을 고정시킨다.

setFocusedCell( rowIndex , colIndex , editMode )

그리드의 특정 셀로 포커스를 이동한다

Parameter
name	type	required	description
rowIndex	Number	Y	포커스를 이동한 셀의 rowIndex
colIndex	Number	Y	포커스를 이동한 셀의 colIndex
editMode	Boolean	Y	포커스를 이동한 후에 editMode로 전환할지 여부

Sample

grid1.setFocusedCell(0, 0, true); // 포커스를 0,0의 셀로 이동하고 editMode로 전환한다.

setFocusedHeaderObj( headerId )

그리드 헤더가 가진 object로 포커스를 이동한다.(selectbox, checkbox, input인 경우)

Parameter
name	type	required	description
headerId	String	Y	header의 아이디

Sample

grid1.setFocusedHeaderObj("headerCol1"); // 포커스를 해당 헤더가 가진 object로 이동시킨다.

setFooterCaption( htmlStr )

그리드 footer 테이블의 caption의 innerHTML 값을 설정합니다.

Parameter
name	type	required	description
htmlStr	String	Y	caption의 innerHTML 값으로 설정될 값

setFooterData( footerId , data )

footerId에 해당하는 footer의 inputType이 text인 경우에 data의 값을 footer에 넣어줍니다.

Parameter
name	type	required	description
footerId	String	Y	footer의 아이디 혹은 인덱스
data	String	Y	footer에 넣을 값

Sample

grid1.setFooterData("column1", "합계");

setFooterDisplayFormat( footerId , displayFormat )

그리드의 footerId에 해당하는 footer의 포맷을 설정합니다.

Parameter
name	type	required	description
footerId	Number	Y	그리드 컬럼의 인덱스
displayFormat	String	Y	컬럼에 적용할 포맷

Sample

grid1.setFooterDisplayFormat("a", "#,###"); // id가 "a"인 컬럼의 format을 "#,###"로 설정

setFooterStyle( footerId , style , value )

그리드의 footerId에 해당하는 footer cell의 스타일 속성을 설정합니다.

Parameter
name	type	required	description
footerId	String	Y	그리드 footer cell의 id, 혹은 index("$rowNum", "$rowStatus"로 rowNum, rowStatus 셀 지정 가능)
style	String	Y	적용할 스타일 속성
value	String	Y	적용할 스타일 속성값

Sample

grid1.setFooterStyle("a", "background-color", "red"); // id가 "a"인 footer cell의 "background-color"속성을 "red"로 설정

setFooterValue( footerId , data )

footerId에 해당하는 footer의 inputType이 text인 경우에 data의 값을 footer에 넣어줍니다.

Parameter
name	type	required	description
footerId	string	Y	footer의 아이디 혹은 인덱스
data	string	Y	footer에 넣을 값

setGridHeight( height )

그리드의 높이를 설정합니다.

Parameter
name	type	required	description
height	Number	Y	변경할 그리드의 높이

Sample

grid1.setGridHeight(500); // 그리드의 height를 500px로 설정한다.

setGridReadOnly( readOnly )

그리드의 읽기 전용 속성을 설정합니다.

Parameter
name	type	required	description
readOnly	Boolean	Y	그리드의 읽기 전용 속성

Sample

grid1.setGridReadOnly(true); // 그리드를 읽기 전용으로 설정한다.

setGridSize( width , height )

그리드의 높이와 폭을 설정합니다.

Parameter
name	type	required	description
width	Number	Y	변경할 그리드의 폭
height	Number	Y	변경할 그리드의 높이

Sample

grid1.setGridSize(500,500); // 그리드의 width와 height을 500px 500px 로 설정한다.

setGridWidth( width )

그리드의 폭을 설정합니다.

Parameter
name	type	required	description
width	Number	Y	변경할 그리드의 폭

Sample

grid1.setGridWidth(500); // 그리드의 width를 500px로 설정한다.

setHeaderBackgroundColor( headerId , color )

그리드의 헤더 셀의 배경 색상을 지정합니다.

Parameter
name	type	required	description
headerId	String	Y	header cell의 id
color	String	Y	background에 지정할 색상

setHeaderColor( headerId , color )

그리드의 헤더 셀의 글씨 색상을 지정합니다.

Parameter
name	type	required	description
headerId	String	Y	header cell의 id
color	String	Y	글씨 색상

setHeaderDisabled( headerId , disabled )

disabled가 true이면 headerId에 해당하는 헤더를 disalbled시켜줍니다. false이면 disabled을 풀어줍니다.

Parameter
name	type	required	description
headerId	String	Y	header의 아이디
disabled	Boolean	Y	header의 disabled 여부

Sample

grid1.setHeaderDisabled("hName", true); // id가 'hName'인 헤더 셀을 disabled 시킨다.

setHeaderHide( hide )

hide가 true이면 header를 숨기고 false이면 나타나도록 합니다.

Parameter
name	type	required	description
hide	Boolean	Y	header의 숨김 여부

Sample

grid1.setHeaderHide(true); // 그리드의 header를 숨긴다

setHeaderNodeSet( headerId , nodeset , label , value )

headInputType이 select일 경우, headerId에 해당 하는 header 컬럼 selectbox itemset의 Model 바인딩 ref를 셋팅합니다.

Parameter
name	type	required	description
headerId	String	Y	header의 아이디
nodeset	String	N	변경하려는 nodeset의 xpath 문자열
label	String	N	변경하려는 label의 xpath 문자열
value	String	N	변경하려는 value의 xpath 문자열

Sample

grid1.setHeaderNodeSet('hName','colorNode/vector','label/@value','value/@value');

setHeaderSortImage( headerId , order , sortOrd )

header에 나타나는 sort 이미지를 조절한다

Parameter
name	type	required	description
headerId	String	Y	이미지를 조절한 header의 ID
order	Number	Y	sort 순서를 나타내는 숫자 값(오름차순이면 1, 내림차순이면 -1, sort를 하지 않는 상태이면 0)
sortOrd	Number	N	multisort의 경우 sort의 우선순위를 나타내는 숫자 값. 하위호환성을 위해 이 값이 설정되어있지않으면 기본값은 0

Sample

// 'name' 컬럼을 오름차순으로 sort하며, id가 'hName'인 헤더에 sortImage를 오름차순으로 설정한다. grid1.sort( "name", 1 ); grid1.setHeaderSortImage('hName', 1); // multisort의 경우 세번째 인자로 sort우선순위를 나타내는 숫자값을 전달하면 그림 아래에 해당 숫자가 표시된다. grid1.setHeaderSortImage('column2', -1, 3);

setHeaderStyle( headerId , style , value )

그리드의 headerId에 해당하는 header cell의 스타일 속성을 설정합니다.

Parameter
name	type	required	description
headerId	String	Y	그리드 header cell의 id, 혹은 index("$rowNum", "$rowStatus"로 rowNum, rowStatus 셀 지정 가능)
style	String	Y	적용할 스타일 속성
value	String	Y	적용할 스타일 속성값

Sample

grid1.setHeaderStyle("a", "background-color", "red"); // id가 "a"인 header cell의 "background-color"속성을 "red"로 설정

setHeaderValue( headerId , value )

headerId에 해당 하는 header 컬럼의 value를 설정 합니다. 설정된 value로 header 컬럼이 출력 됩니다.

Parameter
name	type	required	description
headerId	String	Y	header의 아이디
value	String	Y	header 컬럼에 출력된 문자열

Sample

grid1.setHeaderValue('hName' , "CAFE"); // id가 hName인 header에 출력문자열을 CAFE로 설정한다.

setJSON( jsonData , append )

JSON Data를 Grid에 넣거나 추가합니다. (행의 상태는 초기상태인 "R"로 변경됩니다.)

Parameter
name	type	required	description
jsonData	Object	Y	객체를 담고 있는 array형태의 JSON 객체
append	String	N	이어쓰기 여부, false이면 기존 데이터삭제 [true/false] 생략시 false. [생략가능]

Sample

jsonData의 데이터 구조 var jsonData = [ { AA : "A1", BB : "B1", CC : "C1" }, { AA : "A2", BB : "B2", CC : "C2" } ]; grid1.setJSON( jsonData );

setNoResultMessage( message )

데이터 없음을 표시하기한 문자열을 설정합니다.

Parameter
name	type	required	description
message	String	Y	데이터 없을 때 표시할 문자열

Sample

grid1.setNoResultMessage('No Result.'); // 데이터가 없을 경우, No Result. 가 표시된다.

setOpacity( value )

컴포넌트의 CSS Opacity(불투명도)값를 설정한다.

Parameter
name	type	required	description
value	Number	Y	Opacity 값 (0과 1사이의 실수)

Sample

componentId.setOpacity(0.45);

setPosition( left , top , mode )

컴포넌트의 위치(left,top)를 설정한다.

Parameter
name	type	required	description
left	Number	Y	left의 값 또는 null.
top	Number	Y	top의 값 또는 null.
mode	String	N	[defulat:absolute, delta]absolute이면 x,y로 현재 값을 설정하고 delta이면 현재 값에 x,y값만큼을 더해서 설정.

Sample

//컴포넌트의 top만 100px로 설정. componentId.setPosition(null, 100);

setReadOnly( type , rowIndex , colIndex , readOnly )

해당하는 type의 readOnly 속성 값을 param으로 들어온 readOnly값으로 설정합니다.

Parameter
name	type	required	description
type	String	Y	readOnly 속성을 설정할 type (grid, row, column, cell 총 4개)
rowIndex	Number	Y	readOnly속성을 설정할 행 번호
colIndex	Number	Y	readOnly속성을 설정할 열 번호
readOnly	Boolean	Y	readOnly 속성에 적용할 값

Sample

grid1.setReadOnly("grid", true); // 그리드 전체의 readOnly 속성을 true로 적용시킨다. grid1.setReadOnly("row", 0, true); // 첫번째 행의 readOnly 속성을 true로 적용시킨다. grid1.setReadOnly("cell", 0, 4, true); // 첫번째 행에서 다섯번째 열의 cell의 readOnly 속성을 true로 적용시킨다.

setRowBackgroundColor( rowIndex , color )

rowIndex에 해당하는 행에 param으로 들어온 color를 배경색으로 설정합니다.

Parameter
name	type	required	description
rowIndex	Number	Y	배경색을 설정할 행 번호
color	String	Y	배경색으로 설정할 색

Sample

grid1.setRowBackgroundColor(0, "#0000FF"); // 첫번째 행의 배경색을 파랑으로 한다.

setRowColor( rowIndex , color )

rowIndex에 해당하는 행에 param으로 들어온 color를 글자색으로 설정합니다.

Parameter
name	type	required	description
rowIndex	Number	Y	글자색을 설정할 행 번호
color	String	Y	글자색으로 설정할 색

Sample

grid1.setRowColor(0, "#0000FF"); // 첫번째 행의 글자색을 파랑으로 한다.

setRowData( rowIndex , rowData , overwrite )

rowIndex에 해당하는 행에 rowData를 넣어줍니다. overwrite가 false인 경우에 행을 만들어서 넣어줍니다.

Parameter
name	type	required	description
rowIndex	Number	Y	rowData를 넣어줄 행 번호
rowData	Object	Y	rowIndex에 해당하는 행에 넣을 데이터의 배열
overwrite	Boolean	N	덮어쓰는 여부의 옵션 없으면 false

setRowDisabled( rowIndex , disabled )

colIndex에 해당하는 행의 disabled속성을 param으로 들어온 disabled로 설정합니다.

Parameter
name	type	required	description
rowIndex	Number	Y	disabled속성을 설정할 행 번호
disabled	Boolean	Y	disabled속성에 적용할 값

Sample

grid1.setRowDisabled(0, true); // 첫번째 행의 disabled 속성을 적용시킨다.

setRowNumColumnWidth( size )

rowNum컬럼의 폭을 변경합니다.

Parameter
name	type	required	description
size	Number	Y	변경할 컬럼의 폭

Sample

grid1.setRowNumColumnWidth(100); // rowNum 컬럼의 width를 100px로 변경한다.

setRowReadOnly( rowIndex , readOnly )

rowIndex에 해당하는 행의 readonly속성을 param으로 들어온 readonly로 설정합니다.

Parameter
name	type	required	description
rowIndex	Number	Y	readonly속성을 설정할 행 번호
readOnly	Boolean	Y	readonly속성에 적용할 값

Sample

grid1.setRowReadOnly(0, true); // 첫번째 행의 readOnly속성을 적용시킨다.

setRowStatusColumnWidth( size )

rowStatus컬럼의 폭을 변경합니다.

Parameter
name	type	required	description
size	Number	Y	변경할 컬럼의 폭

Sample

grid1.setRowStatusColumnWidth(100); // rowStatus 컬럼의 width를 100px로 변경한다.

setRowXML( rowIndex , rowData , overwrite )

rowIndex에 해당하는 행에 rowData를 넣어줍니다. overwrite가 false인 경우에 행을 만들어서 넣어줍니다.

Parameter
name	type	required	description
rowIndex	Number	Y	rowData를 넣어줄 행 번호
rowData	XML element	Y	행에 넣을 xml데이터
overwrite	Boolean	N	덮어쓰는 여부의 옵션 없으면 false

Sample

id가 a,b,c,d,e인 5개 컬럼이 존재하는 그리드에서 a컬럼의 dataType이 date이고 b컬럼의 dataType이 number이며 각각의 displayFormat이 yyyy.MM.dd, #,###인 경우. 첫번째 행의 각 컬럼의 데이터는 다음과 같다. ( 20120101 , 23456 , Inswave , WebSquare , sample ) baseNode : gridData , repeatNode : vector , valueNode : value 으로 되어 있다. var xmlStr = '<vector>' + '<a value = "20120101"/>' + '<b value = "23456"/>' + '<c value = "Inswave"/>' + '<d value = "new WebSquare"/>' + '<e value = "new sample"/>' + '</vector>'; var xmlDoc = WebSquare.xml.parse(xmlStr); grid1.setRowXML(0, xmlDoc); // grid의 첫번째 행에 xmlDoc의 데이터가 추가된다.

setSize( width , heigth )

컴포넌트의 크기(width,height)를 설정한다.

Parameter
name	type	required	description
width	Number	Y	새로 설정할 컴포넌트의 width값 또는 null
heigth	Number	Y	새로 설정할 컴포넌트의 height값 또는 null

Sample

//컴포넌트의 height만 100px로 설정. componentId.setSize(null,100);

setStartRowNumber( startRowNumber )

startRowNumber에 해당하는 인덱스를 행번호의 시작점으로 설정합니다.

Parameter
name	type	required	description
startRowNumber	Number	Y	행의 번호를 시작할 인덱스

Sample

grid1.setStartRowNumber(9); // 첫 줄이 10부터 나오게 설정. grid1.setStartRowNumber(0); // 다시 첫 줄이 1부터 나오게 설정.

setStyle( propertyName , value )

컴포넌트의 property별 style을 설정한다.

Parameter
name	type	required	description
propertyName	String	Y	style 속성 이름
value	String	Y	적용 할 style의 값

Sample

//컴포넌트의 width를 200px로 설정 할 경우 componentId.setStyle("width", "200px"); //배경색을 olive로 변경 할 경우 componentId.setStyle("background-color","olive");

setSummary( str )

그리드 테이블의 summary 값을 설정합니다.

Parameter
name	type	required	description
str	String	Y	summary 값에 설정될 string

setTopRowIndex( topRowIndex )

그리드의 세로 스크롤 위치를 이동하여 최상단에 topRowIndex에 해당하는 row가 위치하도록 조정합니다.

Parameter
name	type	required	description
topRowIndex	Number	Y	최상단에 위치할 rowIndex

Sample

grid1.setTopRowIndex(0); // 그리드의 세로 스크롤을 맨 위로 이동하여 최상단에 rowIndex가 0인 row가 위치하도록 조정

setUserData( key , value )

컴포넌트에 사용자 데이터를 설정한다. 컴포넌트에 설정이 가능한 key가 아닌 경우, key 설정이 불가능하며 log에 관련 내용이 출력 된다.

Parameter
name	type	required	description
key	String	Y	임의 데이터의 키
value	String	Y	임의 데이터의 값

Sample

//컴포넌트에 'data'라는 key로 'WebSquare'라는 값을 설정 할 경우 componentId.setUserData("data", "WebSquare"); //아래와 같이 컴포넌트에 설정이 가능한 key가 아닌 경우, key 설정이 불가능하다. componentId.setUserData("title", "WebSquare"); //log 표현 예시 ) !!!WARNING - [title] can't define as UserData

setXML( element , append )

XML[xml데이터]을 Grid에 넣거나 추가합니다. (행의 상태는 초기상태인 "R"로 변경됩니다.)

Parameter
name	type	required	description
element	XML Document	Y	그리드 데이터를 갖고 있는 XML
append	String	N	이어쓰기 여부, false이면 기존 데이터삭제 [true/false] 생략시 false. [생략가능]

Sample

Model에 bind된 데이터가 다음과 같다. <gridData rowCount="20"> <vector> <image value="/image/0001.jpg" /> <name value="해외펜팔카페 Renaissance 입니다." /> <category value="펜팔, 해외펜팔" /> <member value="23159" /> <admin value="RS클레아" /> <grade value="#g1" /> <since value="20111114" /> </vector> <vector> <image value="/image/0002.jpg" /> <name value="RH- 혈액형. 특별한 사람들" /> <category value="RH-, 희귀혈액형" /> <member value="8049" /> <admin value="서울 아트" /> <grade value="#g2" /> <since value="20070722" /> </vector> (중략)... </gridData> grid의 baseNode 속성은 gridData, repeatNode 속성은 vector, valueNode 속성은 value로 되어 있으며, 각 그리드 셀의 id는 repeatNode 하위의 노드명(예:image, name 등)과 같다. 아래와 같이 setXML을 이용하여 그리드에 기존 데이터를 삭제하고 xmlDoc를 추가할 수 있다. var xmlDoc = WebSquare.ModelUtil.findInstanceNode( "gridData" ); grid1.setXML (xmlDoc, false);

show( displayType )

컴포넌트를 화면에 보이도록 설정한다.
엔진 내부적으로는 CSS를 display속성과 visibility:show;으로 처리한다.

Parameter
name	type	required	description
displayType	String	N	[default:block ,inline ,none ,""]display의 속성 값.

Sample

//display 속성이 "block"이 된다. componentId.show(); //class에 적용된 display 속성 값을 다시 복구. componentId.show("");

sort( bodyColumnID , sortType )

bodyColumnID에 해당하는 열을 정렬해줍니다.

Parameter
name	type	required	description
bodyColumnID	String	Y	정렬시킬 열의 아이디
sortType	Number	Y	정렬 옵션 0이면 오름차순 1이면 내림차순 2이면 정렬을 취소

Sample

grid1.sort('date', 0); // date컬럼의 값을 기준으로 오름차순으로 정렬한다. sort함수를 사용시, dataType에 상관없이 text로 간주하여 정렬이 된다. number 타입의 컬럼을 정렬해야 하는 경우에는 multisort 사용을 권장한다.

spanAll( openFlag )

drilldown을 사용하는 grid에서 전체 데이터를 모두 펼치거나 모두 접는다. 인자로 숫자를 넣는 경우 해당 depth까지 데이터를 펼친다.

Parameter
name	type	required	description
openFlag	Boolean\|\|Number	Y	[true, false]open 여부, 숫자를 넣는 경우 해당 depth까지 데이터를 펼친다.

Sample

grid1.spanAll(true); // 접혀 있는 데이터를 모두 펼친다. grid1.spanAll(2); // depth가 2까지인 데이터를 모두 펼친다.

toggleClass( className )

컴포넌트가 className의 이름을 가진 class를 가지고 있다면 제거하고, 가지고 있지 않다면 추가한다.
기본 설정은 addClass API를 통해 추가 된 class만 삭제되며 컴포넌트의 class 속성에 직접 정의 된 class를 삭제해야하는 경우는 config.xml파일의 설정을 아래와 같이 적용해야한다.
<style><removeDefaultClass value="true" /></style>

Parameter
name	type	required	description
className	String	Y	설정 할 className

Sample

//아래와 같이 input 컴포넌트에 class를 정의 한 경우 <xf:input id="input1" style="position: relative;width: 144px;height: 21px;" class="tmpInputClass"></xf:input> //config.xml 파일에 아래와 같이 정의. <style> <removeDefaultClass value="true" /> </style> //적용 된 tmpInputClass class 삭제 input1.toggleClass("tmpInputClass"); //tmpInputClass class를 다시 추가 input1.toggleClass("tmpInputClass");

trigger( type , array )

컴포넌트에 등록 된 특정 이벤트를 발생시킨다.

Parameter
name	type	required	description
type	String	Y	발생시킬 이벤트 이름
array	Array	N	이벤트 핸들러에 전달할 파라미터 배열

Sample

//input1 컴포넌트에 onclick이벤트를 발생시킨다. input1.trigger("onclick"); //input1에 onviewchange이벤트를 발생시키고 핸들러 함수에 (1,2) 인자를 전달하여 호출한다. input1.trigger("onviewchange", [1,2]);

unbind( type , function )

컴포넌트에 등록 된 이벤트를 제거한다.

Parameter
name	type	required	description
type	String	N	제거할 이벤트 이름. 생략할 경우 해당 컴포넌트의 모든 이벤트를 제거한다.
function	Function	N	제거할 이벤트의 핸들러 함수. 생략할 경우 해당 이벤트 type으로 등록된 모든 핸들러 함수를 제거한다.

Sample

//input1에 등록된 모든 이벤트를 제거 input1.unbind(); //input1에 등록된 onviewchange이벤트 핸들러 함수를 모두 제거 input1.unbind("onviewchange"); //input1에 등록된 onviewchange이벤트에서 func1 이벤트 핸들러를 제거 input1.unbind("onviewchange", func1);

undeleteRow( rowIndex )

rowInex에 해당하는 행이 삭제 상태를 취소합니다.

Parameter
name	type	required	description
rowIndex	Number	Y	삭제를 취소할 행번호.

Sample

grid1.deleteRow(0); // 첫 번째 row를 delete 상태로 설정. grid1.undeleteRow(0); // 첫 번째 row의 rowStatus의 delete 상태를 취소. (rowStatusValue: 0, rowStatus: R)

undoAll( )

갱신이나 삭제된 행들의 data를 처음 입력된 데이터로 바꿔주고 행의 상태를 초기화 시켜줍니다.

Sample

grid1.undoAll(); // 모든 갱신되거나 삭제된 데이터를 되돌리고 rowStatus를 초기화한다.

undoRow( rowIndex )

rowIndex에 해당하는 row의 data를 수정되기전 data로 바꿔주고 행의 상태를 복구합니다.

Parameter
name	type	required	description
rowIndex	Number	Y	data를 변경할 행 번호

Sample

grid1.undoRow(0); // 첫 번째 row의 data를 복구

visible( flag )

[deprecated]show/hide 로 사용하거나 setStyle을 통해 visible 속성을 설정한다.
컴포넌트의 style 중 visibility 값을 설정한다. true이면 "visible", false이면 "hidden"을 설정.

Parameter
name	type	required	description
flag	Boolean	Y	visibility 값을 설정할 값(true이면 "visible", false이면 "hidden"을 설정)