GridBase

GridBase는 GridViewTreeView의 기반 클래스(Base Class)이다.

상세 설명

GridBase 의 모든 속성과 method 는 이를 상속한 하위 클래스들에서만 호출할 수 있다.

[하위 클래스]

GridView

TreeView

GridBase 로 직접 설정하거나 호출할 수 없다.

프로퍼티 목록


메서드 목록


콜백 목록



프로퍼티 정보

checkBar


checkBar: CheckBar

그리드의 체크바에 관한 설정 모델

상세 설명

CheckBar 객체를 반환한다. CheckBar 속성을 가져오거나 설정할 수 있다.

예제 코드

gridView.checkBar.visibleOnly = true;

copyOptions


copyOptions: CopyOptions

클립보드에 복사하는 것에 대한 설정 모델

상세 설명

CopyOptions 객체를 반환한다. CopyOptions 의 속성을 가져오거나 설정할 수 있다.

예제 코드

gridView.copyOptions.singleMode = true;

dataDropOptions


dataDropOptions: DataDropOptions

데이터 drag and drop 과 관련 된 설정 모델

상세 설명

dataDropOptions 를 반환한다. DataDropOptions 의 속성을 가져오거나 설정할 수 있다.

예제 코드

gridView.dataDropOptions.dropMode = 'copy';

disabled


disabled: boolean

그리드가 마우스/키보드 이벤트에 대하여 반응안함 상태

상세 설명

값 할당으로 변경할 수 있다.

예제 코드

gridView.disabled = true;

displayOptions


displayOptions: DisplayOptions

그리드 수준에서 관리되는 표시 정보들에 대한 설정 모델

상세 설명

DisplayOptions 객체를 반환한다. DisplayOptions 의 속성을 가져오거나 설정할 수 있다.

예제 코드

gridView.displayOptions.columnResizable = true;

editOptions


editOptions: EditOptions

데이터 편집에 대한 설정 모델

상세 설명

EditOptions 객체를 반환한다. EditOptions 의 속성을 가져오거나 설정할 수 있다.

예제 코드

gridView.editOptions.deletable = true;

editorOptions


editorOptions: EditorOptions

편집기에 대한 설정 모델

상세 설명

EditorOptions 객체를 반환한다. EditorOptions 의 속성을 가져오거나 설정할 수 있다.

예제 코드

gridView.editorOptions.yearDisplayFormat = "{Y}년";

filteringOptions


filteringOptions: FilteringOptions

데이터 필터링에 대한 설정 모델

상세 설명

FilteringOptions 객체를 반환한다. FilteringOptions 의 속성을 가져오거나 설정할 수 있다.

예제 코드

gridView.filteringOptions.enabled = false;

fixedOptions


fixedOptions: FixedOptions

그리드의 고정 행 및 컬럼에 대한 설정 모델

상세 설명

FixedOptions 객체를 반환한다. FixedOptions 의 속성을 가져오거나 설정할 수 있다.

예제 코드

gridView.fixedOptions.colCount = 2;

footer


footer: GridFooter

첫번째 푸터에 관한 설정 모델

상세 설명

GridFooter 객체를 반환한다. GridFooter 의 속성을 가져오거나 설정할 수 있다.

예제 코드

gridView.footer.styleName = 'custom-footer-1';

footers



푸터들에 관한 설정 모델

상세 설명

GridFooter 의 콜렉션 객체를 반환한다. GridFootersObj 의 속성을 가져오거나 설정할 수 있다.

예제 코드

gridView.footers.visible = false;

formatOptions


formatOptions: FormatOptions

데이터 필드 값의 변환 형식에 대한 설정 모델

상세 설명

FormatOptions 객체를 반환한다. FormatOptions 의 속성을 가져오거나 설정할 수 있다.

예제 코드

gridView.formatOptions.datetimeFormat = 'yyyy-mm-dd';

formOptions


formOptions: FormOptions

그리드 모바일 화면인 FormView 에 대한 설정 모델

예제 코드

gridView.formOptions.autoClose = true;

formView


formView: FormView

그리드의 모바일 전용 화면 모델

예제 코드

form = gridView.formView;

header


header: GridHeader

그리드의 헤더 영역에 관한 설정 모델

상세 설명

GridHeader 객체를 반환한다. GridHeader 의 속성을 가져오거나 설정할 수 있다.

예제 코드

gridView.header.showTooltip = true;

headerSummaries


headerSummaries: HeaderSummariesObj

그리드 헤더 영역에 표시되는 Header Summary 에 대한 컬렉션 설정 모델

상세 설명

HeaderSummary 의 콜렉션 객체를 반환한다. HeaderSummariesObj 의 속성을 가져오거나 설정할 수 있다.

예제 코드

gridView.headerSummaries.visible = false;

headerSummary


headerSummary: HeaderSummary

그리드 헤더 영역에 표시되는 첫번째 Header Summary에 대한 설정 모델

상세 설명

HeaderSummary 객체를 반환한다. HeaderSummary 의 속성을 가져오거나 설정할 수 있다.

예제 코드

gridView.headerSummary.visible = false;

hideDeletedRows


hideDeletedRows: boolean

그리드에 설정되어 있는 삭제된 행들의 숨김 여부

상세 설명

값 할당으로 변경할 수 있다.

예제 코드

gridView.hideDeletedRows = true;

mobileOptions


mobileOptions: MobileOptions

모바일 관련 설정 모델

상세 설명

mobileOptions 를 반환한다. MobileOptions 의 속성을 가져오거나 설정할 수 있다.

예제 코드

gridView.mobileOptions.longTabDuration = false;

onViewActivated


onViewActivated: (grid: GridBase, active: boolean) => void

form view와 grid view 사이에 활성 상태가 변경될 때 발생한다.

pasteOptions


pasteOptions: PasteOptions

클립보드의 데이터를 붙여 넣는 것에 대한 설정 모델

상세 설명

PasteOptions 객체를 반환한다. PasteOptions 의 속성을 가져오거나 설정할 수 있다.

예제 코드

gridView.pasteOptions.enabled = false;

redoing


redoing: boolean

현재상태에서 재실행 가능 여부

예제 코드

gridView.redoing = false

rowIndicator


rowIndicator: RowIndicator

그리드의 인디케이터에 관한 설정 모델

상세 설명

RowIndicator 객체를 반환한다. RowIndicator 속성을 가져오거나 설정할 수 있다.

예제 코드

gridView.rowIndicator.displayValue = 'row';

sortingOptions


sortingOptions: SortingOptions

데이터 정렬에 대한 설정 모델

상세 설명

SortingOptions 객체를 반환한다. SortingOptions 의 속성을 가져오거나 설정할 수 있다.

예제 코드

gridView.sortingOptions.style = 'reverse';

sortMode


sortMode: SortMode

데이터 수정 이후 정렬 동작 모드

상세 설명

그리드에 설정되어 있는 SortMode 를 반환한다. 값 할당으로 변경할 수 있다.

예제 코드

gridView.sortMode = "explicit";

stateBar


stateBar: StateBar

그리드의 상태바에 관한 설정 모델

상세 설명

StateBar 객체를 반환한다. StateBar 속성을 가져오거나 설정할 수 있다.

예제 코드

gridView.stateBar.mark = 'image';

summaryMode


summaryMode: SummaryMode

현재 그리드의 합계를 계산하는 방식

상세 설명

그리드에 설정되어 있는 SummaryMode 를 반환한다. 값 할당으로 변경할 수 있다.

예제 코드

gridView.summaryMode = "aggregate";

undoable


undoable: boolean

실행취소 기능 사용 가능 여부

상세 설명

값 할당으로 변경할 수 있다.

예제 코드

gridView.undoable = false

undoing


undoing: boolean

현재상태에서 실행취소 가능 여부

예제 코드

gridView.undoing = false

메서드 정보

activateAllColumnFilters


activateAllColumnFilters(column:string | DataColumn,active:boolean):void

컬럼에 등록된 모든 필터들을 적용 또는 해제한다.

매개변수

  • column: string | DataColumn

    해당하는 컬럼의 이름 또는 컬럼 객체

  • active: boolean

    true: 적용, false: 해제.

예제 코드

gridView.activateAllColumnFilters('행정구역별', true);

activateColumnFilters


activateColumnFilters(column:string | DataColumn,filterNames:string | string[],active:boolean):void

컬럼에 등록된 필터들 중, filterNames 에 포함된 필터명을 갖는 필터들을 적용시키거나 해제한다.

매개변수

  • column: string | DataColumn

    해당하는 컬럼의 이름 또는 컬럼 객체

  • filterNames: string | string[]

    적용 또는 해제할 필터의 이름 혹은 필터들의 이름의 배열

  • active: boolean

    true: 적용, false: 해제.

예제 코드

gridView.activateColumnFilters('행정구역별', ['전'], true);

addColumn


addColumn(column:ConfigObject,index:number):void

설정된 컬럼들 외에 추가로 컬럼을 설정한다.

매개변수

  • column: ConfigObject

    추가할 컬럼 (GridColumn 과 같은 오브젝트)

  • index: number

    해당 컬럼이 위치할 순서(숨김컬럼 포함). 값을 지정하지 않으면 컬럼의 가장 마지막에 추가된다.

예제 코드

let col = {
     "name": "EmployeeID",
     "fieldName": "EmployeeID",
     "type": "data",
     "width": "90",
     "header": {
         "text": "Employee ID"
     }
}

gridView.addColumn(col);

addColumnFilters


addColumnFilters(column:string | DataColumn,filters:ColumnFilter[],overwrite:boolean):void

컬럼에 하나 이상의 필터를 등록한다. column.autoFilter가 true인 경우 적용되지 않는다.

매개변수

  • column: string | DataColumn

    해당하는 컬럼의 이름 또는 컬럼 객체

  • filters: ColumnFilter[]

    등록할 필터 객체의 배열, ColumnFilter 의 배열

  • overwrite: boolean

    기본값: false, overwrite가 false 시 중복된 이름의 필터가 있을 경우 에러를 발생시킨다.

예제 코드

gridView.addColumnFilters('행정구역별', [{
         name: "전",
         criteria: "value = '전'"
     }, {
         name: "답",
         criteria: "value = '답'"
     }])

addLookupSource


addLookupSource(source:LookupSource):void

lookup tree에서 사용할 LookupSource 를 추가 등록한다.

매개변수

상세 설명

기존id에 추가를 원하는 경우는 fillLookupData() 를 사용한다.

예제 코드

let area3codes = {
     id:"area2code",
     levels:3,
     keys: [['11', '11010', '1101053'], ['11', '11010', '1101054']],
     values: ['사직동', '삼청동']
};
gridView.addLookupSource(area3codes);

addPopupMenu


addPopupMenu(name:string,menuItems:PopupMenuItem[]):void

그리드에 Popup Menu를 추가한다.

매개변수

상세 설명

추가된 메뉴는 데이터셀 등에 연결할 수 있다.

예제 코드

let menu = [{
     label: "menu1 입니다.",
     children: [{
         label: "submenu1 입니다."
     }, {
         label: "submenu2 입니다."
     }]
 }, {
     label: "menu2 입니다",
 }, {
     label: "-"
 }, {
     label: "menu3 입니다",
     type: "check",
     checked: true,
     tag: "check_menu"
 }];

gridView.addPopupMenu('menu1', menu);

applyCheckables


applyCheckables():void

CheckBar에 Expression 기준으로 checkable을 적용한다.

예제 코드

gridView.applyCheckables();

autoFiltersRefresh


autoFiltersRefresh(columns:string[] | DataColumn[],applyFilters:boolean):void

column.autoFilter가 true인경우 filter목록을 갱신한다.

매개변수

  • columns: string[] | DataColumn[]

    컬럼이름 또는 컬럼 객체의 배열. 입력하지 않는 경우 전체 컬럼.

  • applyFilters: boolean

    active된 filter의 적용 여부.

상세 설명

autoFilter의 목록을 갱신할때 호출한다. 또는 사용자가 filter 아이콘을 클릭하면 자동으로 갱신된다.

beginUpdate


beginUpdate():void

그리드와 관련된 속성들이 변경될 때마다 update lock 을 걸어 내부적인 변경 처리 호출을 지연시킨다.

상세 설명

endUpdate() 와 같이 사용한다.

예제 코드

gridview.beginUpdate();
try {
    gridview.displayOptions( { ... });
    gridview.selectOptions( { ... });
...
} finally {
    gridview.endUpdate();
}

cancel


cancel():boolean

현재 편집 중인 행의 편집을 취소한다.

반환값

타입: boolean

취소 성공 여부

상세 설명

편집 중이 아니라면 아무 일도 하지 않는다. 편집을 완료할 때는 commit() 을 호출해야 한다.

예제 코드

gridView.cancel();

cancelEditor


cancelEditor():void

편집을 취소하고 편집기 창을 닫는다.

예제 코드

gridView.cancelEditor();

checkAll


checkAll(checked:boolean,visibleOnly:boolean,checkableOnly:boolean,checkEvent:boolean):void

그리드의 데이터행을 모두 체크,해제한다.

매개변수

  • checked: boolean

    기본값: true, true: 체크, false: 체크 해제

  • visibleOnly: boolean

    collapse로 인해 접혀서 보이지 않는 행의 포함여부

  • checkableOnly: boolean

    체크가능한 행만 체크할 것인지의 여부

  • checkEvent: boolean

    기본값: true, onItemChecked() 의 발생 여부

상세 설명

CheckBar 의 exclusive에 영향을 받지않는다.

예제 코드

gridView.checkAll();

checkItem


checkItem(itemIndex:number,checked:boolean,exclusive:boolean,checkEvent:boolean):void

지정된 아이템을 체크하거나 해제한다.

매개변수

  • itemIndex: number

    아이템의 인덱스

  • checked: boolean

    기본값: true, true: 체크, false: 체크 해제

  • exclusive: boolean

    기본값: false, true: 체크된 다른아이템이 있는 경우 모두 해제하고 아이템 인덱스로 입력된 아이템만 체크

  • checkEvent: boolean

    기본값: true, onItemChecked() 의 발생 여부

예제 코드

gridView.checkItem(4);

checkItems


checkItems(itemIndices:number[],checked:boolean,checkEvent:boolean):void

입력된 아이템 배열에 해당하는 아이템을 체크하거나 해제한다.

매개변수

  • itemIndices: number[]

    아이템 인덱스 배열

  • checked: boolean

    기본값: true, true: 체크, false: 체크 해제

  • checkEvent: boolean

    기본값: true, onItemChecked() 의 발생 여부

예제 코드

gridView.checkItems([1,2,3,4]);

checkRow


checkRow(row:number,checked:boolean,exclusive:boolean,checkEvent:boolean):void

지정된 데이터 행을 체크하거나 해제한다.

매개변수

  • row: number

    행 고유 번호

  • checked: boolean

    기본값: true, true: 체크, false: 체크 해제

  • exclusive: boolean

    기본값: false, true: 체크된 다른아이템이 있는 경우 모두 해제하고 row로 입력된 아이템만 체크

  • checkEvent: boolean

    기본값: true, onItemChecked() 의 발생 여부

예제 코드

gridView.checkRow(4);

checkRows


checkRows(rows:number[],checked:boolean,checkEvent:boolean):void

입력된 고유 행 번호들과 연결된 Item을 체크하거나 해제한다.

매개변수

  • rows: number[]

    고유 행 번호의 배열

  • checked: boolean

    기본값: true, true: 체크, false: 체크 해제

  • checkEvent: boolean

    기본값: true, onItemChecked() 의 발생 여부

예제 코드

gridView.checkRows([1,2,3,4]);

clearColumnFilters


clearColumnFilters(column:string | DataColumn):void

컬럼에 등록된 필터들을 제거한다. column.autoFilter가 true인 경우 적용되지 않는다.

매개변수

  • column: string | DataColumn

    해당하는 컬럼의 이름 또는 컬럼 객체

예제 코드

gridView.clearColumnFilters();

clearCommandStack


clearCommandStack(all:boolean):void

Command Stack 을 초기화한다.

매개변수

  • all: boolean

    ?

예제 코드

gridView.clearCommandStack();

clearCurrent


clearCurrent():void

focus를 제거한다.

예제 코드

gridView.clearCurrent();

clearInvalidCells


clearInvalidCells():void

값 검증에 실패한 셀 정보들을 삭제한다.

상세 설명

이 함수는 validateCells() 를 먼저 실행한 후 가져온 검증에 실패한 데이터의 목록을 지울때 사용한다.

예제 코드

gridView.validateCells();
gridView.clearInvalidCells();
let invalids = gridView.getInvalidCells(); // null

clearLookupData


clearLookupData(sourceId:string):void

지정된 SourceId에 해당하는 lookup source를 clear한다.

매개변수

  • sourceId: string

    LookupSource의 id

예제 코드

gridView.clearLookupData('area1code');

clearRowHeights


clearRowHeights(all:boolean):void

변경 적용한 개별 행 높이를 초기값으로 되돌린다.

매개변수

  • all: boolean

    true: 전부, false: setRowHeight() 로 바꾼것만 비포함

예제 코드

gridView.clearRowHeights(true);

clearSelection


clearSelection():void

선택 영역을 제거한다.

예제 코드

gridView.clearSelection();

closeList


closeList():void

필터박스 또는 DropDown Editor를 닫는다.

예제 코드

gridView.closeList();

closeLoading


closeLoading():void

로딩 애니메이션을 숨긴다.

예제 코드

gridView.closeLoading();

closeProgress


closeProgress():void

프로그레스 바를 닫는다.

예제 코드

gridView.closeProgress();

columnByField


columnByField(fieldName:string):GridColumn

필드 이름으로 지정되는 데이터필드에 연결되어 있는 첫 번째 컬럼 정보를 반환한다.

매개변수

  • fieldName: string

    필드이름

반환값

타입: GridColumn

컬럼 설정 정보나 컬럼이 존재하지 않는 경우 null

예제 코드

let col = gridView.columnByField('fieldName');

columnByName


columnByName(name:string):GridColumn

컬럼 이름으로 컬럼 설정 정보를 반환한다.

매개변수

  • name: string

    컬럼 이름

반환값

타입: GridColumn

컬럼이 존재하지 않는 경우 null

예제 코드

let col = gridView.columnByName('colName');

commit


commit(force:boolean):boolean

편집 중인 행의 편집을 완료하고 DataProvider에 저장한다.

매개변수

  • force: boolean

    기본값: false, true: 입력/편집 중 편집을 취소한 행(RowState 변경은 없고, Indicator 에 편집으로 표시된)을 커밋

반환값

타입: boolean

데이터 변경이 발생한 경우 true 반환

예제 코드

gridView.commit();

commitEditor


commitEditor(hideEditor:boolean):void

현재 편집기의 내용을 셀에 반영한다.

매개변수

  • hideEditor: boolean

    기본값: true, Editor의 종료 여부

상세 설명

실행 후 onEditCommit, onEditRowChanged, onCellEditted 이벤트가 순차적으로 발생한다.

예제 코드

gridView.commitEditor();

copyToClipboard


copyToClipboard(selection:Selection,copy:boolean):any

선택한 영역에 포함된 셀들의 정보를 복사 혹은 반환한다.

매개변수

  • selection: Selection

    선택 영역의 정보, 지정하지 않으면 그리드 전체가 복사된다.

  • copy: boolean

    기본값: true, true: 클립보드에 복사, false: 반환

반환값

타입: any

copyfalse 시 반환

예제 코드

let sel = gridView.getSelection();
let copied = gridView.copyToClipBoard(sel);

deleteSelection


deleteSelection(force:boolean):void

현재 선택 영역 안의 행들을 삭제한다.

매개변수

  • force: boolean

    true 시 대화 상자 표시 없이 바로 삭제한다.

상세 설명

grid.editOptions.deletable 이 false인 경우 작동하지 않는다.

예제 코드

gridView.deleteSelection(true);

destroy


destroy():void

그리드를 해제한다.

예제 코드

gridView.destory();

endUpdate


endUpdate(force:boolean):void

update lock 을 풀고 그리드를 다시 그린다.

매개변수

  • force: boolean

    beginUpdate() 의 호출 여부에 상관없이 그리드를 다시 그린다.

상세 설명

beginUpdate() 와 같이 사용한다.

예제 코드

beginUpdate() 참조

eraseSelection


eraseSelection():void

선택 영역 안의 셀들의 값을 지운다. 즉, undefined로 값을 변경한다.

예제 코드

gridView.eraseSelection();

existsCustomRenderer


existsCustomRenderer(type:string):boolean

사용자렌더러가 있는지 확인한다.

매개변수

  • type: string

    등록한 렌더러 이름

반환값

타입: boolean

existsLookupData


existsLookupData(sourceId:string,keys:string[]):boolean

지정된 lookupsource에 지정된 키가 존재하는지 여부를 반환한다.

매개변수

  • sourceId: string

    LookupSource의 Id.

  • keys: string[]

    찾을 키 값, 값들.

반환값

타입: boolean

예제 코드

gridView.existsLookupData('area1code', ['12']);

exportGrid


exportGrid(options:GridExportOptions):void

지정한 설정에 따라 현재 그리드의 모양과 데이터를 외부 문서로 내보낸다.

매개변수

예제 코드

gridView.exportGrid({
     type: 'csv'
})

fillEditSearchItems


fillEditSearchItems(column:string,searchKey:string,values:string[],labels:string[]):void

입력값과 관련된 항목을 조회하여 리스트에 표시한다. 부분검색 용도로 사용된다.

매개변수

  • column: string

    리스트가 표시 될 컬럼 객체 또는 컬럼명

  • searchKey: string

    검색 키 값

  • values: string[]

    검색된 value 값들

  • labels: string[]

    검색된 label 값들

예제 코드

let CustomerNames = ["ALFKI", "ANATR", "ANTON", "AROUT", "BERGS", "BLAUS"];
dataProvider.setFields([
     {fieldName:"code"},
     {fieldName:"codeName"} // 코드 명을 가지고 있는 필드
]);
gridView.setColumns([{
     fieldName:"code",
     name:"code",
     editor:{type:"search",searchLength:1, searchDelay:500, useCtrlEnterKey:true, useEnterKey:true },
     lookupDisplay:true,
     labelField:"codeName"
}]);

// 마지막 키가 입력되고 searchDelay가 지나면 발생되는 이벤트
gridView.onEditSearch = function (grid, index, text) {
     console.log("onEditSearch:" + index.itemIndex + "," + index.column + ", " + text);
     let values = CustomerNames.filter(function (str) {
         return str.indexOf(text) == 0;
     });
     let labels = CustomerNames.filter(function (str) {
         return str.indexOf(text) == 0;
     });
     console.log(values);
     gridView.fillEditSearchItems(index.column, text, values, labels);
};

// searchEditor에서 선택이 되며 발생되는 이벤트
gridView.onGetEditValue = function (grid, index, editResult) {
     if (index.column === "code") {
         grid.setValue(index.itemIndex, "codeName",editResult.text);
     };
};

fillLookupData


fillLookupData(sourceId:string,data:LookupData):void

lookupSource에 lookupData를 추가한다.

매개변수

예제 코드

gridView.fillLookupData("lookup1", {keys:[["14"],["15"]], values:["가나다라","일이삼사"]});

fitLayoutWidth


fitLayoutWidth(layout:string | DataColumn,maxWidth:number,minWidth:number):number

셀의 너비를 글자 길이에 맞게 변경한다.

매개변수

  • layout: string | DataColumn

    layout이름 또는 column

  • maxWidth: number

    최대 너비

  • minWidth: number

    최소 너비

반환값

타입: number

상세 설명

GroupLayout의 하위 그룹이 있는 경우 자동으로 변경할수 없다. grid.displayOptions.refreshMode 가 "visibleOnly"인 경우 화면에 표시되지 않는 컬럼의 너비는 조정되지 않는다.

예제 코드

gridView.fitLayoutWidth('layout1')

fullItemCount


fullItemCount():number

그리드의 전체 아이템 갯수를 반환한다.

반환값

타입: number

예제 코드

let totalCount = gridView.fullItemCount();

getActiveColumnFilters


getActiveColumnFilters(column:string | DataColumn,active:boolean):ColumnFilter[]

등록된 필터들 중 적용된 필터 또는 해제된 필터의 이름을 반환한다.

매개변수

  • column: string | DataColumn

    해당하는 컬럼의 이름 또는 컬럼 객체

  • active: boolean

    기본값: true, true: 활성화 된 필터 반환, false: 해제된 필터 반환

반환값

타입: ColumnFilter[]

활성화 상태에 해당하는 ColumnFilter 와 같은 모델의 필터 오브젝트의 배열

예제 코드

gridView.getActiveColumnFilters('행정구역별');

getCellBounds


getCellBounds(itemIndex:number,column:string | GridColumn,outer:boolean):object

그리드에서 지정한 셀의 좌표값을 반환한다.

매개변수

  • itemIndex: number

    행의 순서

  • column: string | GridColumn

    컬럼 이름이나 컬럼 객체

  • outer: boolean

반환값

타입: object

좌표값, 보이지 않는 영역에 있을 경우 null 을 반환한다.

예제 코드

let bounds = gridView.getCellBounds(3, '행정구역별');

// {x, y, width, height} 반환

getCheckBar


getCheckBar():CheckBar

그리드 체크바와 관련된 설정 정보를 CheckBar 의 모델로 반환한다.

반환값

타입: CheckBar

예제 코드

let checkBar = gridView.getCheckBar();
checkBar.exclusive = false;
gridView.setStateBar(checkBar);

getChildModel


getChildModel(parentModel:GridItem,index:number,extended:boolean):GridItem

아이템 모델의 자식 모델을 반환한다.

매개변수

  • parentModel: GridItem

    아이템 모델 정보

  • index: number

    자식 모델 사이에서의 해당 자식 모델의 인덱스

  • extended: boolean

    확장정보 포함 여부, 기본값: false

반환값

타입: GridItem

상세 설명

GridItem 의 형식으로 반환한다.

예제 코드

let model = gridView.getModel(3);
let child = gridView.getChildModel(model, 2);

getChildModels


getChildModels(parentModel:GridItem,extended:boolean):GridItem[]

아이템 모델의 자식 모델들을 반환한다.

매개변수

  • parentModel: GridItem

    아이템 모델 정보

  • extended: boolean

    확장정보 포함 여부, 기본값: false

반환값

타입: GridItem[]

상세 설명

GridItem 의 배열 형식으로 반환한다.

예제 코드

let model = gridView.getModel(3);
let childs = gridView.getChildModels(model);

getColumn


getColumn(index:number):GridColumn

해당하는 index 번째의 컬럼을 반환한다.

매개변수

  • index: number

    그리드에서의 순서

반환값

타입: GridColumn

예제 코드

let col = gridView.getColumn(0);

getColumnFilter


getColumnFilter(column:string | DataColumn,filterName:string):ColumnFilter

지정한 컬럼에서 필터 이름에 해당하는 필터를 반환한다.

매개변수

  • column: string | DataColumn

    지정한 컬럼의 이름 또는 컬럼 객체

  • filterName: string

    필터 이름

반환값

타입: ColumnFilter

ColumnFilter 와 같은 모델의 필터 오브젝트

예제 코드

gridView.getColumnFilter('행정구역별', ['전']);

getColumnFilters


getColumnFilters(column:string | DataColumn):ColumnFilter[]

지정한 컬럼에서 필터들을 반환한다.

매개변수

  • column: string | DataColumn

    해당하는 컬럼의 이름 또는 컬럼 객체

반환값

타입: ColumnFilter[]

ColumnFilter 와 같은 모델의 필터 오브젝트의 배열

예제 코드

gridView.getColumnFilters('행정구역별');

getColumnNames


getColumnNames(columnsOnly:boolean,visibleOnly:boolean):string[]

그리드에 설정된 컬럼들을 반환한다.

매개변수

  • columnsOnly: boolean

    기본값: false, false면 반환 시 컬럼 그룹들을 포함

  • visibleOnly: boolean

    기본값: false, false면 반환 시 숨긴 컬럼들을 포함

반환값

타입: string[]

컬럼 이름 배열

예제 코드

let onlyColsNames = gridView.getColumnNames(true, false);

getColumnProperty


getColumnProperty(column:string | GridColumn,prop:string):any

해당 컬럼의 속성을 반환한다.

매개변수

  • column: string | GridColumn

    컬럼의 이름 또는 컬럼 객체

  • prop: string

    속성 이름

반환값

타입: any

prop에 입력된 속성명의 값이다.

예제 코드

let colRenderer = getColumnProperty('colName', 'renderer');

getColumns


getColumns():GridColumn[]

그리드에 설정된 컬럼들을 반환한다.

반환값

타입: GridColumn[]

예제 코드

let cols = gridView.getColumns();

getContainer


getContainer():HTMLDivElement

그리드가 위치한 div를 반환한다.

반환값

타입: HTMLDivElement

예제 코드

let gridContainer = gridView.getContainer;

getCopyOptions


getCopyOptions():CopyOptions

ctrl+c 를 이용해서 그리드를 복사할때 적용되는 설정을 CopyOptions 모델로 반환한다.

반환값

타입: CopyOptions

예제 코드

let copy = gridView.getCopyOptions();
copy.enabled = false;
gridView.setCopyOptions(copy);

getCurrent


getCurrent():CellIndex

현재 focus 된 셀의 위치정보를 반환한다.

console.log(JSON.stringify(grid.getCurrent()));

반환값

타입: CellIndex

getDataDropOptions


getDataDropOptions():DataDropOptions

데이터 drag 앤 drop과 관련 된 설정 정보들을 DataDropOptions 모델로 반환한다.

반환값

타입: DataDropOptions

예제 코드

let drop = gridView.getDataDropOptions();
drop.dropMode = 'copy'
gridView.setDataDropOptions(drop);

getDataRow


getDataRow(itemIndex:number):number

지정한 그리드 행의 고유 번호를 반환한다.

매개변수

  • itemIndex: number

    행의 순서

반환값

타입: number

예제 코드

let row = gridView.getDataRow(0);

getDataSource



그리드에 연결되어 있는 DataProvider를 반환한다.

예제 코드

let ds = gridView.getDataSource();

getDescendantModels


getDescendantModels(parentModel:GridItem,extended:boolean):GridItem[]

아이템 모델의 자손 모델들을 반환한다.

매개변수

  • parentModel: GridItem

    아이템 모델 정보

  • extended: boolean

    확장정보 포함 여부, 기본값: false

반환값

타입: GridItem[]

상세 설명

GridItem 의 배열 형식으로 반환한다.

예제 코드

let model = gridView.getModel(3);
let descendants = gridView.getChildModels(model);

getDisplayColumns


getDisplayColumns():GridColumn[]

현재 보여지고 있는 컬럼들을 반환한다.

반환값

타입: GridColumn[]

예제 코드

let displayCols = gridView.getDisplayColumns();

getDisplayOptions


getDisplayOptions():DisplayOptions

그리드 표시와 관련된 설정 정보들을 DisplayOptions 의 모델로 반환한다.

반환값

타입: DisplayOptions

예제 코드

let display = gridView.getDisplayOptions();
display.rowHeight = 20;
gridView.setDisplayOptions(display);

getDisplayValues


getDisplayValues(itemIndex:number):object

지정한 행의 데이터 값들을 각종 포맷이나 정규식이 적용된 형태의 JSON객체로 반환한다.

매개변수

  • itemIndex: number

    정보를 가져올 행의 순서

반환값

타입: object

입력된 itemIndex가 행의 고유 번호와 연결된 행이 아닌경우 null이 출력된다.

예제 코드

gridView.getDisplayValues('3');

getDisplayValuesOfRow


getDisplayValuesOfRow(dataRow:number):object

행 고유 번호로 지정한 행의 데이터 값들을 각종 포맷이나 정규식이 적용된 형태의 JSON객체로 반환한다.

매개변수

  • dataRow: number

    행의 고유 번호

반환값

타입: object

입력된 dataRow가 존재하지 않을 경우 null이 출력된다.

예제 코드

gridView.getDisplayValues('42');

getEditingItem


getEditingItem():EditingItemInfo

그리드가 편집 중인 아이템의 정보를 반환한다.

반환값

타입: EditingItemInfo

편집 중인 그리드 아이템의 정보. 편집 중이 아닌 경우 null 반환. EditingItemInfo 형식.

예제 코드

let eItemInfo = gridView.getEditingItem();

getEditOptions


getEditOptions():EditOptions

그리드 편집 방식과 관련된 정보들을 EditOptions 모델로 반환한다.

반환값

타입: EditOptions

예제 코드

let edit = gridView.getEditOptions();
edit.editable = true;
gridView.setEditOptions(edit);

getEditorOptions


getEditorOptions():EditorOptions

편집기 표시 정보를 EditorOptions 모델로 반환한다.

반환값

타입: EditorOptions

예제 코드

let editor = gridView.getEditorOptions();
editor.yearDisplayFormat = '{Y} year';
gridView.setEditorOptions(editor);

getEditValue


getEditValue():any

그리드가 편집 중일때 현재 수정 중인 셀의 값을 반환한다.

반환값

타입: any

데이터 필드의 값

예제 코드

gridView.getEditValue();

getFilteringOptions


getFilteringOptions():FilteringOptions

그리드 필터링과 관련된 설정 정보들을 FilteringOptions 모델로 반환한다.

반환값

타입: FilteringOptions

예제 코드

let filtering = gridView.getFiteringOptions();
filtering.enabled = false;
gridView.setFiteringOptions(filtering);

getFixedOptions


getFixedOptions():FixedOptions

그리드 고정 영역에 관한 설정 정보들을 FixedOptions 의 모델로 반환한다.

반환값

타입: FixedOptions

예제 코드

let fixed = gridView.getFixedOptions();
fixed.colCount = 1;
gridView.setFixedOptions(fixed);

getFooter


getFooter():GridFooter

첫번째 그리드 푸터와 관련된 설정 정보를 GridFooter 모델로 반환한다.

반환값

타입: GridFooter

예제 코드

let footer = gridView.getFooter();
footer.visible = false;
gridView.setFooter(footer);

getFooters


getFooters():GridFooters

그리드 푸터들의 설정 정보들을 GridFooters 모델로 반환한다.

반환값

타입: GridFooters

예제 코드

let footers = gridView.getFooters()
footers[0].visible = false;
gridView.setFooters(footers);

getFormatOptions


getFormatOptions():FormatOptions

그리드의 FormatOptions 를 반환한다.

반환값

타입: FormatOptions

예제 코드

let format = gridView.getFormatOptions();
format.booleanFormat = 'X:O';
gridView.setFormatOptions(format);

getFormOptions


getFormOptions():FormOptions

FormView에 대한 설정 정보들을 FormOptions 모델로 반환한다.

반환값

타입: FormOptions

예제 코드

let formOpts = gridView.getFormOptions();

getGroupModel


getGroupModel(itemIndex:number,extended:boolean):GridItem

itemIndex 에 해당하는 그룹 모델을 반환한다.

매개변수

  • itemIndex: number

    아이템의 인덱스

  • extended: boolean

    확장정보 포함 여부, 기본값: false

반환값

타입: GridItem

상세 설명

GridItem 형식으로 반환한다.

예제 코드

let group = gridView.getGroupModel(1);

getGroupSummary


getGroupSummary(model:GridItem,field:string,statistical:boolean):GroupSummary

지정한 그룹아이템 모델의 합계 정보를 반환한다.

매개변수

반환값

타입: GroupSummary

상세 설명

숫자형 필드에 대해서만 의미있는 값을 리턴한다.

GroupSummary 형식으로 반환한다.

예제 코드

let group = gridView.getGroupModel(1);
let summary = gridView.getGroupSummary(group, 'fieldName', true);

getHeader


getHeader():GridHeader

그리드 헤더와 관련된 설정 정보들을 GridHeader 모델로 반환한다.

반환값

타입: GridHeader

예제 코드

let header = gridView.getHeader();
header.sortable = false;
gridView.setHeader(header);

getHeaderSummaries


getHeaderSummaries():HeaderSummaries

그리드 header summary 들의 설정 정보들을 HeaderSummaries 모델로 반환한다.

반환값

타입: HeaderSummaries

예제 코드

let headerSummaries = gridView.getHeaderSummaries()
headerSummaries[0].visible = false;
gridView.setHeaderSummaries(headerSummaries);

getHeaderSummary


getHeaderSummary():HeaderSummary

첫번째 그리드 header summary 와 관련된 설정 정보를 HeaderSummary 모델로 반환한다.

반환값

타입: HeaderSummary

예제 코드

let headerSummary = gridView.getHeaderSummary();
headerSummary.visible = false;
gridView.setHeaderSummary(headerSummary);

getIndexOfElement


getIndexOfElement(element:HTMLElement):CellIndex

HTMLElemnt가 속한 셀의 위치정보를 반환한다.

매개변수

  • element: HTMLElement

    HTMLElement

반환값

타입: CellIndex

element가 속한 Cell의 index

상세 설명

customRenderer에서 사용자가 생성한 element가 속해있는 셀의 index를 찾기위해 사용.

getInvalidCells


getInvalidCells():InvalidCell[]

값 검증에 실패한 셀 정보들을 반환한다.

반환값

타입: InvalidCell[]

검증에 실패한 셀 정보들, InvalidCell 의 배열 형식을 따른다.

상세 설명

이 함수는 validateCells() 를 먼저 실행한 후 검증에 실패한 데이터를 수정 후 다시 검증할 때 사용한다.

예제 코드

let invalids = gridView.getInvalidCells();

getItemCount


getItemCount():number

그리드에 현재 표시된 Grid Item 개수를 반환한다.

반환값

타입: number

상세 설명

rowGroup의 header, footer가 있는 경우 itemCount에 포함된다.

예제 코드

let count = gridView.getItemCount();

getItemIndex


getItemIndex(dataRow:number):number

행의 고유 번호로 행의 순서를 반환한다.

매개변수

  • dataRow: number

    행의 고유 번호

    let answerRow = gridView.getItemIndex(42);
    

반환값

타입: number

getItemsOfRows


getItemsOfRows(rows:number[]):number[]

입력된 데이터 행들의 고유번호들로 행들의 순서들을 반환한다.

매개변수

  • rows: number[]

    행의 고유 번호의 배열

반환값

타입: number[]

예제 코드

let harshadRows = getItemsOfRows([10, 12, 18, 142857]);

getItemState


getItemState(itemIndex:number):ItemState

아이템의 상태값을 반환한다.

매개변수

  • itemIndex: number

    상태를 가져오려는 아이템의 인덱스

반환값

타입: ItemState

그리드 아이템의 상태값

예제 코드

let itemStates = gridView.getItemState(3);

getJsonRows


getJsonRows():object[]

반환값

타입: object[]

getLayoutByColumn


getLayoutByColumn(column:string | GridColumn):CellLayoutColumnItem

해당 컬럼의 레이아웃 정보를 반환한다.

매개변수

  • column: string | GridColumn

    정보를 얻고자 하는 컬럼의 이름 또는 컬럼 오브젝트

반환값

타입: CellLayoutColumnItem

CellLayoutColumnItem 오브젝트

예제 코드

let layout = gridView.getLayoutByColumn('OrderID');

getLeftPos


getLeftPos():number

가장 왼쪽 화면에 표시되고 있는 컬럼의 x 좌표값을 반환한다.

반환값

타입: number

예제 코드

let leftPos = gridView.getLeftPos();

getMobileOptions


getMobileOptions():MobileOptions

모바일과 관련된 설정 정보들을 MobileOptions 모델로 반환한다.

반환값

타입: MobileOptions

예제 코드

let mobile = gridView.getMobileOptions();
mobile.longTabDuration = 400;
gridView.setMobileOptions(mobile);

getModel


getModel(itemIndex:number,extended:boolean):GridItem

itemIndex 에 해당하는 모델을 반환한다.

매개변수

  • itemIndex: number

    아이템의 인덱스

  • extended: boolean

    확장정보 포함 여부, 기본값: false

반환값

타입: GridItem

상세 설명

GridItem 형식으로 반환한다.

예제 코드

let model = gridView.getModel(3);

getModelAs


getModelAs(itemIndex:number,itemType:ItemType,extended:boolean):GridItem

itemIndex 와 itemType 해당하는 모델을 반환한다.

매개변수

  • itemIndex: number

    아이템의 인덱스

  • itemType: ItemType

    아이템 종류

  • extended: boolean

    확장정보 포함 여부, 기본값: false

반환값

타입: GridItem

상세 설명

GridItem 형식으로 반환한다.

예제 코드

let model = gridView.getModelAs(3, 'row');

getModelOfRow


getModelOfRow(dataRow:number,extended:boolean):GridItem

행 고유번호에 해당하는 아이템 모델을 반환한다.

매개변수

  • dataRow: number

    행 고유번호

  • extended: boolean

    확장정보 포함 여부, 기본값: false

반환값

타입: GridItem

상세 설명

GridItem 의 형식으로 반환한다.

예제 코드

let row = gridView.getModelOfRow(1);

getModels


getModels(itemIndices:number[],extended:boolean):GridItem[]

지정한 아이템의 인덱스들에 해당하는 아이템 모델들을 반홚나다.

매개변수

  • itemIndices: number[]

    아이템의 인덱스 배열

  • extended: boolean

    확장정보 포함 여부, 기본값: false

반환값

타입: GridItem[]

상세 설명

GridItem 의 배열 형식으로 반환한다.

예제 코드

let models = gridView.getModels([1,2,3]);

getModelsOfRows


getModelsOfRows(dataRows:number[],extended:boolean):GridItem[]

행 고유번호들에 해당하는 아이템 모델들을 반환한다.

매개변수

  • dataRows: number[]

    행 고유번호 배열

  • extended: boolean

    확장정보 포함 여부, 기본값: false

반환값

타입: GridItem[]

상세 설명

GridItem 의 배열 형식으로 반환한다.

예제 코드

let rows = gridView.getModelsOfRows([1,2,3]);

getOptions


getOptions():GridOptions

그리드 옵션 정보를 반환한다.

반환값

타입: GridOptions

setOptions 와 다르게 그리드 수준의 정보만을 반환한다.

상세 설명

GridOptions 의 모델로 반환한다.

예제 코드

let options = gridView.getOptions();

getParentModel


getParentModel(model:GridItem,extended:boolean):GridItem

아이템 모델의 부모 아이템 모델을 반환한다.

매개변수

  • model: GridItem

    아이템 모델 정보

  • extended: boolean

    확장정보 포함 여부, 기본값: false

반환값

타입: GridItem

상세 설명

GridItem 의 형식으로 반환한다.

예제 코드

let model = gridView.getModel(3);
let parent = gridView.getParentModel(model);

getPasteOptions


getPasteOptions():PasteOptions

그리드에 붙여넣기를 할때 적용되는 설정을 PasteOptions 모델로 반환한다.

반환값

타입: PasteOptions

예제 코드

let paste = gridView.getPasteOptions();
paste.enabled = false;
gridView.setPasteOptions(paste);

getRootModel


getRootModel(model:GridItem,extended:boolean):GridItem

아이템 모델의 최상위 조상 아이템 모델을 반환한다.

매개변수

  • model: GridItem

    모델 정보

  • extended: boolean

    확장 정보 포함 여부, 기본값: false

반환값

타입: GridItem

예제 코드

const idx = gridView.getCurrent();
const item = gridView.getModel(idx.itemIndex);
const root = gridView.getRootModel(item, extended);

getRowHeight


getRowHeight(itemIndex:number):number

행 높이를 반환한다.

매개변수

  • itemIndex: number

    높이를 반환할 행의 인덱스

반환값

타입: number

예제 코드

gridView.getRowHeight(2);

getRowIndicator


getRowIndicator():RowIndicator

그리드 인디케이터와 관련된 설정 정보들을 RowIndicator 모델로 반환한다.

반환값

타입: RowIndicator

예제 코드

let indicator = gridView.getRowIndicator();
indicator.zeroBase = true;
gridView.setRowIndicator(indicator);

getRowsOfItems


getRowsOfItems(items:number[]):number[]

지정한 그리드 행들의 고유 번호들을 반환한다.

매개변수

  • items: number[]

    행의 순서의 배열

반환값

타입: number[]

예제 코드

let rows = gridView.getRowsOfItems([0, 2, 4, 6]);

getSelectedItems


getSelectedItems(dataOnly:boolean):number[]

현재 선택 영역 안의 행의 인덱스들을 반환한다.

매개변수

  • dataOnly: boolean

    데이터행만 반환한다.

반환값

타입: number[]

예제 코드

let selectedItems = gridView.getSelectedItems(true);

getSelectedRows


getSelectedRows():number[]

현재 선택 영역 안의 데이터 행의 고유번호들을 반환한다.

반환값

타입: number[]

예제 코드

let selectedRows = gridView.getSelectedRows();

getSelection


getSelection():Selection

현재 선택된 영역 정보를 반환한다.

반환값

타입: Selection

예제 코드

let sel = gridView.getSelection();
console.log("Selection: ", JSON.stringify(sel));

getSelectionData


getSelectionData(maxRows:number):any[][]

현재 선택 영역에 포함된 셀들의 값을 반환한다.

매개변수

  • maxRows: number

    반환할 최대 행의 개수. 기본값: -1. 0보다 작은 값이면 제한 없이 모든 행을 반환한다.

반환값

타입: any[][]

셀 데이터들

예제 코드

let selData = gridView.getSelectionData();

getSortedFields


getSortedFields():any[]

현재 정렬되어 있는 필드들의 정렬 정보를 반환한다.

반환값

타입: any[]

Sort 필드 정보 배열. 배열의 각 항목은 direction, orgFieldName, fieldName 의 정보를 가지고 있다.

예제 코드

let sFields = gridView.getSortedFields();

console.log(sFields[0]);
//{
// fieldName: "COMPANYNAME"
// orgFieldName: "CompanyName"
// direction: "descending"
//}

getSortingOptions


getSortingOptions():SortingOptions

그리드 정렬과 관련된 설정 정보들을 SortingOptions 모델로 반환한다.

반환값

타입: SortingOptions

예제 코드

let sorting = gridView.getSortingOptions();
sorting.enabled = false;
gridView.setSortingOptions(sorting);

getStateBar


getStateBar():StateBar

그리드 상태바의 설정 정보를 StateBar 의 모델로 반환한다.

반환값

타입: StateBar

예제 코드

let stateBar = gridView.getStateBar();
stateBar.errorVisible = false;
gridView.setStateBar(stateBar);

getSummary


getSummary(field:string | number,type:SummaryType):number

필드의 합계값을 반환한다.

매개변수

  • field: string | number

    해당 필드명 혹은 인덱스

  • type: SummaryType

    기본값: "sum", 다른 속성값은 SummaryType 참조

반환값

타입: number

상세 설명

summaryMode 에 따라서 가져올수 있는 값이 다르다.

숫자형 데이터 종류의 필드만 합계값을 가져올수 있다.

summaryMode가 none인 경우 미리 계산을 해 놓지 않는다.

summaryMode가 aggregate인 경우 "sum","avg","min",’max","count", "datacount", "dataavg" 를 가져올수 있다.

statistical인 경우 "var","varp","stdev","stdevp"을 추가적으로 가져올수 있다.

예제 코드

let sum = gridView.getSummary('unitPrice', 'sum');

getTopItem


getTopItem():number

그리드 맨 위의 지정한 행의 인덱스를 반환한다.

반환값

타입: number

예제 코드

let topItem = gridView.getTopItem();

getValue


getValue(itemIndex:number,field:string | number):any

행의 순서와 데이터 필드 인덱스로 지정되는 데이터셀의 값을 반환한다.

매개변수

  • itemIndex: number

    행의 순서

  • field: string | number

    필드 인덱스 또는 필드명

반환값

타입: any

데이터 필드의 값

상세 설명

지정한 행이 수정중인 경우 수정된 값을 반환한다. 편집이 완료되지 않은 셀의 값은 가져올수 없다.

예제 코드

gridView.getValue(3, 'UnitPrice');

getValues


getValues(itemIndex:number):object

지정한 행의 데이터 값들을 JSON객체로 반환한다.

매개변수

  • itemIndex: number

    정보를 가져올 행의 순서

반환값

타입: object

입력된 itemIndex가 행의 고유 번호와 연결된 행이 아닌경우 null이 출력된다.

상세 설명

itemIndex와 연결된 행의 고유번호는 반환되는 객체의 __rowId에 담겨있다.

예제 코드

gridView.getValues('3');

hideAllColumnFilters


hideAllColumnFilters(column:string | DataColumn,hide:boolean):void

컬럼에 등록된 모든 필터를 숨기거나 보여준다. column.autoFilter가 true인 경우 적용되지 않는다.

매개변수

  • column: string | DataColumn

    해당하는 컬럼의 이름 또는 컬럼 객체

  • hide: boolean

    기본값: true, true: 숨김, false: 보여줌.

상세 설명

활성화 된 필터를 숨기는 경우 활성화 된 상태로 숨긴다.

예제 코드

gridView.hideAllColumnFilters('행정구역별');

hideColumnFilters


hideColumnFilters(column:string | DataColumn,filterNames:string | string[],hide:boolean):void

컬럼에 등록된 필터들 중, filterNames 에 포함된 필터명을 갖는 필터들을 숨기거나 표시한다. column.autoFilter가 true인 경우 적용되지 않는다.

매개변수

  • column: string | DataColumn

    해당하는 컬럼의 이름 또는 컬럼 객체

  • filterNames: string | string[]

    필터의 이름 혹은 필터들의 이름의 배열

  • hide: boolean

    기본값: true, true: 숨김, false: 보여줌.

상세 설명

활성화 된 필터를 숨기는 경우 활성화 된 상태로 숨긴다.

예제 코드

gridView.hideColumnFilters('행정구역별', ['전']);

hideEditor


hideEditor():void

현재 그리드에서 열려진 편집기를 닫는다.

예제 코드

gridView.hideEditor();

hideToast


hideToast(action:VoidFunction):void

Toast 팝업 창을 숨긴다.

매개변수

  • action: VoidFunction

    toast 창을 숨긴 뒤 수행할 콜백함수를 지정한다. 지정하지 않으면 바로 숨긴다.

예제 코드

const f = function () {
     console.log('hidden toast!');
}
gridView.hideToats(f);

isAllChecked


isAllChecked():boolean

모든 아이템들이 체크되어있는지 여부를 반환한다.

반환값

타입: boolean

CheckBar|CheckBar.head의 v 표시가 활성 상태이면 true를 반환한다.

예제 코드

let all = gridView.isAllChecked();

isCheckable


isCheckable(itemIndex:number):boolean

지정한 아이템의 인덱스로 체크바의 체크 가능 여부를 반환한다.

매개변수

  • itemIndex: number

    아이템의 인덱스

반환값

타입: boolean

체크 가능한지의 여부

예제 코드

let isCheckable = gridView.isCheckable(4);

isCheckableOfRow


isCheckableOfRow(dataRow:number):boolean

지정한 아이템의 고유 번호로 체크바의 체크 가능 여부를 반환한다.

매개변수

  • dataRow: number

    아이템의 dataRow

반환값

타입: boolean

체크 가능한지의 여부

예제 코드

gridView.isCheckableOfRow(4);

isCheckedItem


isCheckedItem(itemIndex:number):boolean

해당 체크바에 체크가 되어있으면 true 를 반환한다.

매개변수

  • itemIndex: number

    아이템의 인덱스

반환값

타입: boolean

예제 코드

gridView.isCheckedItem(4);

isCheckedRow


isCheckedRow(row:number):boolean

행이 체크되어있는지 여부

매개변수

  • row: number

    행 고유 번호

반환값

타입: boolean

예제 코드

gridView.isCheckedRow(4);

isEditing


isEditing():boolean

셀이 현재 편집중이면 true 를 반환한다.

반환값

타입: boolean

예제 코드

let isEditing = gridView.isEditing();

isFiltered


isFiltered(column:string | DataColumn):boolean

그리드의 특정 컬럼이 필터링 되어 있는지 여부를 반환한다.

매개변수

  • column: string | DataColumn

    해당하는 컬럼의 이름 또는 컬럼 객체

반환값

타입: boolean

필터링 여부

예제 코드

gridView.isFiltered('행정구역별');

isItemEditing


isItemEditing():boolean

셀 편집은 끝났으나 커밋은 하지 않았을 때, 편집 중이면 true 를 반환한다.

반환값

타입: boolean

예제 코드

let isItemEditing = gridView.isItemEditing();

isVisible


isVisible():boolean

그리드가 표시된 상태면 true 를 반환한다.

let visible = gridView.isVisible();

반환값

타입: boolean

layoutByColumn


layoutByColumn(column:string):InnerCellLayoutColumnItem

컬럼명을 이용해서 컬럼의 layout설정정보를 찾아온다.

매개변수

  • column: string

    컬럼의 name

반환값

타입: InnerCellLayoutColumnItem

column의 layout설정정보

예제 코드

let layout = gridView.layoutByName("column");

layoutByName


layoutByName(name:string):InnerCellLayoutItem

layout의 이름을 이용해서 layout설정정보를 찾아온다.

매개변수

  • name: string

    layout의 이름

반환값

타입: InnerCellLayoutItem

컬럼 또는 Group의 layout설정정보

예제 코드

let group = gridView.layoutByName("group");
group.direction = "vertical"

linearizeColumns


linearizeColumns(sortProps:string[]):void

컬럼 그룹들을 모두 제거하고 데이터 값을 표시하는 컬럼들만 일렬로 배치한다.

매개변수

  • sortProps: string[]

예제 코드

gridView.linearizeColumns();

mouseToIndex


mouseToIndex(x:number,y:number):ConfigObject

(x, y) 좌표에 해당하는 셀의 위치정보를 반환한다.

매개변수

  • x: number

    x 좌표

  • y: number

    y 좌표

반환값

타입: ConfigObject

셀 위치정보, CellIndex 또는 존재하지 않을 경우 null 을 반환한다.

예제 코드

console.log(gridView.mouseToIndex(10, 10));

orderBy


orderBy(fieldNames:string[],sortDirs:SortDirection[],textCases:SortCase[]):void

하나 이상의 데이터 필드를 기준으로 Grid Item들을 정렬한다.

매개변수

  • fieldNames: string[]

    정렬한 필드 이름 목록

  • sortDirs: SortDirection[]

    각 필드에 대한 정렬 방식 목록

  • textCases: SortCase[]

    대소문자 구분

상세 설명

정렬은 Item Model 수준에서 실행되고, Data Provider 행들의 실제 위치는 변경되지 않는다.

예제 코드

gridView.orderBy(['fruit'], ['descending'], ['insensitive']);

ping


ping(message:any):void

alert 창에 입력된 메시지를 표시한다.

매개변수

  • message: any

    입력된 메세지

예제 코드

gridView.ping("테스트");

redo


redo():boolean

그리드에 연결되어 있는 datasource를 undo했을 때, 다시 수정 후 상태로 되돌린다.

반환값

타입: boolean

예제 코드

gridView.redo();

refresh


refresh(force:boolean):void

그리드를 내부적으로 새로 그린다.

매개변수

  • force: boolean

예제 코드

gridView.refresh()

registerColumnLayouts


registerColumnLayouts(layouts:LayoutItem[]):void

컬럼 레이아웃들을 미리 등록한다.

매개변수

예제 코드

let layouts = [{
        "OrderID",
        {
            name: "companyGroup",
            items: [
                "Country",
                50,
                50,
                {
                    column: "CompanyName",
                    cellSpan: 2
                },
                50,
                50
            ],
            header: {
                text: "Company Group",
                visible: true
            }
        },
    },
...
];

registerCustomRenderer


registerCustomRenderer(type:string,renderer:CustomCellRenderer):void

사용자 지정의 렌더러를 등록한다.

매개변수

예제 코드

// CustomCellRenderer 모델
gridView.registerCustomRenderer("renderer01", {
    initContent(parent) {
        var span = this._span = document.createElement("span");
        parent.append(span);
    }
}

removeColumn


removeColumn(name:string):boolean

해당 컬럼을 제거한다.

매개변수

  • name: string

반환값

타입: boolean

예제 코드

gridView.removeColumn('KorName');

removeColumnFilters


removeColumnFilters(column:string | DataColumn,filterNames:string | string[]):void

컬럼에 등록되어 있는 필터들 중 filterNames에 포함된 필터명을 갖는 필터들을 제거한다. column.autoFilter가 true인 경우 적용되지 않는다.

매개변수

  • column: string | DataColumn

    해당하는 컬럼의 이름 또는 컬럼 객체

  • filterNames: string | string[]

    제거할 필터의 이름 또는 필터들의 이름의 배열

예제 코드

gridView.removeColumnFilters('행정구역별', ['전']);

removeLookupSource


removeLookupSource(sourceId:string):void

지정한 룩업 소스를 삭제한다.

매개변수

  • sourceId: string

    삭제할 LookupSource id

예제 코드

gridView.removeLookupSource('area1code');

removePopupMenu


removePopupMenu(name:string):void

그리드에서 특정 Popup Menu 를 제거한다.

매개변수

  • name: string

    제거할 Popup Menu 의 이름

예제 코드

gridView.removePopupMenu('menu1');

resetCheckables


resetCheckables(clearExpression:boolean):void

CheckBar에 적용된 모든 행의 Checkable 상태를 초기화한다.

매개변수

  • clearExpression: boolean

    CheckBar의 checkableExpression을 clear 실행 여부

resetCurrent


resetCurrent():void

focus cell 의 위치를 첫번째 행, 첫번째 열로 초기화한다.

예제 코드

gridView.resetCurrent();

resetSize


resetSize(callback:any):void

그리드 상위 DIV 영역의 크기를 변경했는데 그리드의 크기가 변경되지 않을때 명시적으로 변경한다.

매개변수

  • callback: any

    크기가 재설정 된 후 실행될 콜백

    const f = function() {
         console.log('resized1)
    }
    gridView.resetSize(f)
    

상세 설명

그리드가 올라갈 element의 크기가 결정되기 전에 그리드가 생성되거나 element의 style.display속성이 none이어서 그리드의 크기가 0 인 경우,

그리드 상위 DIV 영역의 크기를 변경했는데 그리드의 크기가 변경되지 않을때 사용한다.

restoreColumns


restoreColumns():void

그리드의 칼럼위치를 최초상태로 되돌린다.

예제 코드

gridView.restoreColumns();

saveColumnLayout


saveColumnLayout():LayoutInfo[]

현재 화면의 레이아웃 정보를 반환한다.

반환값

타입: LayoutInfo[]

예제 코드

let layouts = gridView.saveColumnLayout();

scrollPage


scrollPage(offset:number):void

현재를 기준으로 페이지를 이동한다.

매개변수

  • offset: number

    현재를 기준으로 이동하려는 페이지 수. 이전 페이지는 음수.

예제 코드

gridView.scrollPage(3);

searchCell


searchCell(options:SearchCellOptions):any

지정한 필드들의 값에 해당하는 셀을 찾아 CellIndex를 반환한다.

매개변수

반환값

타입: any

예제 코드

function searchCellHandler() {
    let value = "PR20012392"
    let fields = [ "RequestType", "ServiceCode" ];
    let startFieldIndex = fields.indexOf(gridView.getCurrent().fieldName) + 1;
    let options = {
         fields : fields,
         value : value,
         startIndex : gridView.getCurrent().itemIndex,
         startFieldIndex : startFieldIndex,
         wrap : true,
         caseSensitive : false,
         partialMatch : true
    }
    let index = gridView.searchCell(options);
    gridView.setCurrent(index);
}

searchItem


searchItem(options:SearchOptions):number

지정한 필드들의 값에 해당하는 첫번째 행을 찾아 행의 번호를 반환한다.

매개변수

반환값

타입: number

예제 코드

function searchItemHandler() {
    let values = ["PR20012392", "QF24212112"]
    let fields = [ "RequestType", "ServiceCode" ];
    let startFieldIndex = fields.indexOf(gridView.getCurrent().fieldName) + 1;
    let options = {
         fields : fields,
         values: values,
         startIndex : gridView.getCurrent().itemIndex,
         startFieldIndex : startFieldIndex,
         wrap : true,
         caseSensitive : false,
         partialMatch : true
    }
    let index = gridView.searchCell(options);
    gridView.setCurrent(index);
}

setAllCheck


setAllCheck(checked:boolean,itemChecked:boolean):void

CheckBar에 설정된 옵션으로 그리드의 데이터행을 모두 체크 또는 해제한다.

매개변수

  • checked: boolean

    기본값: true, true: 체크, false, 해제

  • itemChecked: boolean

    기본값: true, CheckBar.head의 v표시 활성 여부

상세 설명

CheckBar 의 exclusive에 영향을 받지않는다. onItemChecked() 는 발생하지 않는다. CheckBar|CheckBar.head의 v 표시를 활성 상태로 적용시킨다.

예제 코드

gridView.setAllCheck();

setCellStyleCallback


setCellStyleCallback(f:CellStyleCallback):void

셀 스타일을 변경한다.

매개변수

상세 설명

컬럼 당 설정을 위해서는 컬럼의 styleCallback 을 사용해야 한다.

푸터header summary 당 설정을 위해서는 해당 모델의 styleCallback 속성을 사용해야 한다.

예제 코드

const f = function (grid, cell) {
     return {
         styleName: 'custom-cell'
         editor: 'text'
     }
}
gridView.setCellStyleCallback(f);

setCheckable


setCheckable(itemIndex:number,value:boolean):void

지정한 아이템의 체크바의 체크 가능성 여부를 지정한다.

매개변수

  • itemIndex: number

    아이템의 인덱스

  • value: boolean

    체크 가능한지의 여부

예제 코드

gridView.setCheckable(4, false);

setCheckableCallback


setCheckableCallback(callback:CheckableCallback,apply:boolean):void

CheckBar에 checkableCallback 설정한 후 적용을 한다. 혹은 동시수행 한다.

매개변수

  • callback: CheckableCallback

    체크 가능 여부의 콜백

  • apply: boolean

    기본값: true, 즉시 적용 여부

    const f = function(dataSource, item) {
         console.log("checked!")
         return true;
    }
    gridView.setCheckableCallback(f);
    

setCheckableExpression


setCheckableExpression(expression:string,apply:boolean):void

CheckBar에 checkableExpression 설정한 후 적용을 한다. 혹은 동시수행 한다.

매개변수

  • expression: string

    체크 가능 여부의 수식

  • apply: boolean

    기본값: true, 즉시 적용 여부

예제 코드

gridView.setCheckableExpression("row % 2 = 1");

setCheckableOfRow


setCheckableOfRow(dataRow:number,value:boolean):void

지정한 행의 체크바의 체크 가능성 여부를 지정한다.

매개변수

  • dataRow: number

    아이템의 dataRow

  • value: boolean

    체크 가능한지의 여부

setCheckBar


setCheckBar(value:CheckBar):void

그리드 체크바의 설정 정보를 CheckBar 의 모델로 설정한다.

매개변수

  • value: CheckBar

    CheckBar 모델과 같은 정보. 변경하고자 하는 속성만 전달하면 된다.

예제 코드

gridView.setCheckBar({exclusive: true});

setColumn


setColumn(value:ConfigObject):void

그리드에 설정된 컬럼의 정보를 변경한다.

매개변수

  • value: ConfigObject

    변경할 정보. 컬럼의 이름 또는 GridColumn 과 같은 모델의 오브젝트.

상세 설명

컬럼 정보를 재설정하기 위해서는 먼저 columnByName 등으로 먼저 기존 설정 정보를 가져와야 한다.

예제 코드

let col = {
     name: 'existed column'
}
col.editor = {
    type: 'text'
}
gridView.setColumn(col);

setColumnFilters


setColumnFilters(column:string | DataColumn,filters:ColumnFilter[]):void

그리드 컬럼에 필터를 설정한다.

매개변수

상세 설명

사용가능한 Operator와 variables는 Expression 참조

예제 코드

let filters = [{
         name: "전",
         criteria: "value = '전'"
     }, {
         name: "답",
         criteria: "value = '답'"
     }, {
         name: "'임야' or '공장용지'",
         criteria: "(value = '임야') or (value = '공장용지')"
     }, {
         name: "대지: value > '대지'",
         criteria: "value > '대지'"
     }];

gridView.setColumnFilters('지목', filters);

setColumnLayout


setColumnLayout(layout:string | LayoutItem[]):void

그리드의 컬럼 레이아웃을 설정한다.

매개변수

  • layout: string | LayoutItem[]

    변경할 레이아웃 정보

상세 설명

string 으로 입력할 경우 미리 등록되어이 있는 레이아웃으로 설정한다.

예제 코드

layout = [{
        "OrderID",
        {
            name: "companyGroup",
            items: [
                "Country",
                50,
                50,
                {
                    column: "CompanyName",
                    cellSpan: 2
                },
                50,
                50
            ],
            header: {
                text: "Company Group",
                visible: true
            }
        }
    }
];
gridView.setColumnLayout(layout)

setColumnProperty


setColumnProperty(column:string | GridColumn,prop:string,value:any):void

그리드에 설정된 컬럼의 특정 속성 정보를 변경한다.

매개변수

  • column: string | GridColumn

    컬럼의 이름 또는 컬럼 객체

  • prop: string

    속성 이름

  • value: any

    변경 값

상세 설명

editor 속성 안에 있는 속성을 변경하려는 경우 editor 전체를 다시 지정해야 한다.

values, labels를 변경하는 경우 setColumnProperty() 로 변경할 수 없으며 setColumn() 으로 컬럼을 재지정해야 한다.

예제 코드

gridView.setColumnProperty('colName', 'editor', {
     type: 'text'
});

setColumns


setColumns(columns:ConfigObject[]):void

기존에 설정된 컬럼들을 모두 제거하고 새로운 컬럼들로 그리드를 재구성한다.

매개변수

  • columns: ConfigObject[]

    GridColumn 과 같은 오브젝트의 컬럼 설정 정보 배열

예제 코드

 let cols = [{
     "name": "EmployeeID",
     "fieldName": "EmployeeID",
     "type": "data",
     "width": "90",
     "header": {
         "text": "Employee ID"
     }
 }, {
     "name": "OrderDate",
     "fieldName": "OrderDate",
     "type": "data",
     "width": "130",
     "header": {
         "text": "Order Date"
     }
 }]

 gridView.setColumns(cols);

setContextMenu


setContextMenu(menuItems:PopupMenuItem[]):void

그리드에서 오른쪽 마우스를 클릭했을때 표시되는 컨텍스트 메뉴에 추가할 메뉴 항목들을 지정한다.

매개변수

상세 설명

메뉴가 클릭되면 onContextMenuItemClicked 콜백을 호출한다

예제 코드

let menu = [{
     label: "menu1 입니다.",
     children: [{
         label: "submenu1 입니다."
     }, {
         label: "submenu2 입니다."
     }]
 }, {
     label: "menu2 입니다",
 }, {
     label: "-"
 }, {
     label: "menu3 입니다",
     type: "check",
     checked: true,
     tag: "check_menu"
 }];

gridView.setContextMenu(menu);

setCopyOptions


setCopyOptions(options:CopyOptions):void

복사 정보를 CopyOptions 모델로 설정한다.

매개변수

  • options: CopyOptions

    CopyOptions 모델과 같은 설정 정보. 변경하고자 하는 속성만 전달하면 된다.

예제 코드

gridView.setCopyOptions({enabled: false});

setCurrent


setCurrent(current:CellIndex,select:boolean):void

focus cell 의 위치를 지정한다.

매개변수

  • current: CellIndex

    셀 위치정보

  • select: boolean

    선택 영역 초기화 여부

상세 설명

행의 경우 itemIndex, dataRow 중 하나 지정할 수 있고, 컬럼의 경우 column(컬러명), fieldIndex, fieldName 중 하나로 지정할 수 있다.

단, 중복 적용될 경우 뒤부터 순서대로 우선 적용된다.

예제 코드

gridView.setCurrent({ itemIndex: 1, column: '행정구역별' });

setDataDropOptions


setDataDropOptions(options:DataDropOptions):void

데이터 drag 앤 drop과 관련 된 설정 정보들을 DataDropOptions 모델로 설정한다.

매개변수

예제 코드

gridView.setDataDropOptions({dropMode: 'copy'});

setDataSource


setDataSource(dataProvider:LocalDataProvider | LocalTreeDataProvider):void

그리드에 Data Provider를 연결한다.

매개변수

예제 코드

let dataProvider = new RealGrid.LocalDataProvider();
gridView = new RealGrid.GridView("realgrid");
gridView.setDataSource(dataProvider);

setDisplayOptions


setDisplayOptions(options:DisplayOptions):void

그리드 표시 정보를 DisplayOptions 모델로 설정한다.

매개변수

예제 코드

gridView.setDisplayOptions({rowResizable: true});

setEditOptions


setEditOptions(options:EditOptions):void

그리드 편집 방식과 관련된 정보들을 EditOptions 모델로 재설정한다.

매개변수

  • options: EditOptions

    EditOptions 모델과 같은 설정 정보. 변경하고자 하는 값들만 전달하면 된다.

예제 코드

gridView.setEditOptions({editable: false});

setEditorOptions


setEditorOptions(options:EditorOptions):void

편집기 표시 정보를 EditorOptions 모델로 설정한다.

매개변수

상세 설명

날자 편집기의 표시형태를 변경하는 경우 달력 팝업이 최초 실행(생성)되기 전에 먼저 설정되어야 한다(한번 실행되고난 후 중간에 변경할 수 없음).

예제 코드

gridView.setEditorOptions({yearDisplayFormat: "{Y} year"});

setEditValue


setEditValue(value:any,startEdit:boolean,dropdown:boolean):void

focus가 위치한 셀에 값을 설정한다.

매개변수

  • value: any

    설정하려는 값

  • startEdit: boolean

    기본값: false, true: 셀이 편집중이 아닌 경우 값을 설정하고 편집기를 표시. false: 값을 설정하지 않음.

  • dropdown: boolean

    기본값: true, false: dropdownCellEditor, dateCellEditor등과 같이 dropdown이 되는 editor의 경우 dropdown을 표시하지 않는다.

예제 코드

gridView.setEditValue('newValue');

setFilteringOptions


setFilteringOptions(options:FilteringOptions):void

그리드 필터링과 관련된 정보들을 FilteringOptions 모델로 설정한다.

매개변수

상세 설명

FilterSelectorOptions, FilterAutomatingOptions, ToastOptions 는 속성으로 직접 접근해서 수정해야한다.

예제 코드

gridView.setFilteringOptions({enabled: false});

setFixedOptions


setFixedOptions(options:FixedOptions):void

그리드 고정 영역에 관한 정보를 FixedOptions 의 모델로 설정한다.

매개변수

  • options: FixedOptions

    FixedOptions 모델과 같은 설정 정보. 변경하고자 하는 값들만 전달하면 된다.

예제 코드

gridView.setFixedOptions({colCount: 2});

setFocus


setFocus():void

그리드가 focus된다.

예제 코드

gridView.setFocus();

setFooter


setFooter(value:GridFooter):void

첫번째 그리드 푸터의 설정 정보를 GridFooter 모델로 설정한다.

매개변수

  • value: GridFooter

    GridFooter 모델과 같은 정보. 변경하고자 하는 속성만 전달하면 된다.

예제 코드

gridView.setFooter({className: 'custom-footer-1'});

setFooters


setFooters(value:GridFooters):void

그리드 푸터들의 설정 정보들을 GridFooter 의 컬렉션 모델로 설정한다.

매개변수

  • value: GridFooters

    GridFooterCollection 모델과 같은 정보. 변경하고자 하는 속성만 전달하면 된다.

예제 코드

// object
gridView.setFooters({
     visible: false;
     items: [
         {
             styleName: 'custom-footer-1';
         },
         {
             styleName: 'custom-footer-2';
         },
     ]
});

// array
gridView.setFooters([
         {
             styleName: 'custom-footer-1';
         },
         {
             styleName: 'custom-footer-2';
         },
     ]);

setFormatOptions


setFormatOptions(options:FormatOptions):void

그리드의 FormatOptions 를 설정한다.

매개변수

예제 코드

gridView.setFormatOptions({booleanFormat: 'wrong:correct'});

setHeader


setHeader(value:GridHeader):void

그리드 헤더의 설정 정보를 GridHeader 모델로 설정한다.

매개변수

  • value: GridHeader

    GridHeader 모델과 같은 정보. 변경하고자 하는 속성만 전달하면 된다.

예제 코드

gridView.setHeader({sortable: false});

setHeaderSummaries


setHeaderSummaries(value:HeaderSummaries):void

그리드 header summary 들을 HeaderSummaries 모델로 설정한다.

매개변수

예제 코드

// object
gridView.setHeaderSummaries({
     visible: false;
     items: [
         {
             styleName: 'custom-hsumarry-1';
         },
         {
             styleName: 'custom-hsumarry-2';
         },
     ]
});

// array
gridView.setFooters([
         {
             styleName: 'custom-hsumarry-1';
         },
         {
             styleName: 'custom-hsumarry-2';
         },
     ]);

setHeaderSummary


setHeaderSummary(value:HeaderSummary):void

첫번째 그리드 header summary 의 설정 정보를 HeaderSummary 모델로 설정한다.

매개변수

예제 코드

gridView.setHeaderSummary({styleName: 'custom-hsummary-1'});

setLeftCol


setLeftCol(index:number):void

그리드 왼쪽 경계에 지정한 컬럼이 위치한다.

매개변수

  • index: number

예제 코드

gridView.setLeftCol(10);

setLeftPos


setLeftPos(position:number):void

그리드 왼쪽 경계가 지정한 값에 위치한다.

매개변수

  • position: number

    x좌표 값

예제 코드

gridView.setLeftPos(10);

setLookups


setLookups(sources:LookupSource[]):void

lookup tree 에서 사용할 lookup source 들을 등록한다.

매개변수

상세 설명

기존id에 추가를 원하는 경우는 fillLookupData() 를 사용한다.

예제 코드

let area1codes = {
     id: "area1code",
     levels: 1,
     keys: ['11', '21'],
     values: ['서울특별시', '부산광역시']
}

let area2codes = {
     id:"area2code",
     levels:2,
     keys: [['11', '11010'], ['11', '11020']],
     values: ['종로구', '중구']
};

gridView.setLookups([area1codes, area2codes]);

setMobileOptions


setMobileOptions(options:MobileOptions):void

모바일과 관련된 설정 정보들을 MobileOptions 모델로 설정한다.

매개변수

예제 코드

gridView.setMobileOptions({longTapDuration: 300});

setOptions


setOptions(options:GridOptions):void

그리드 옵션 정보를 재설정한다.

매개변수

상세 설명

그리드 수준의 정보만을 반환하는 getOptions 와 달리 이 method를 통해 하위 구성 요소 및 다른 실행 정보들을 동시에 재설정할 수 있다. GridOptions 의 모델로 설정한다.

예제 코드

let options =  {
    summaryMode: 'aggregate',
    displayOptions: {
        columnResizable : false
    }
};
gridView.setOptions(options);

setPasteOptions


setPasteOptions(options:PasteOptions):void

그리드에 PasteOptions 모델로 붙여넣기 정보를 설정한다.

매개변수

  • options: PasteOptions

    PasteOptions 모델과 같은 설정 정보. 변경하고자 하는 속성만 전달하면 된다.

예제 코드

gridView.setPasteOptions({enabled: false});

setProgress


setProgress(min:number,max:number,position:number,message:string):void

프로그레스 바의 상태를 설정한다.

매개변수

  • min: number

    최소 값

  • max: number

    최대 값

  • position: number

    최소 값과 최대 값 사이의 현재 값

  • message: string

    Progress Bar 하단에 표시할 문자열, 미 지정시 기본 문자열 출력

상세 설명

화면에 표시될 진척의 최소/최대값 현재값, 표시 문자을 설정한다.

예제 코드

gridView.setProgress(0, 100, 50);

setRowHeight


setRowHeight(itemIndex:number,height:number,refresh:boolean):void

행 높이를 지정한 높이로 변경한다.

매개변수

  • itemIndex: number

    높이 변경할 행의 순서

  • height: number

    기본값: 0, 행 높이. 0으로 지정시 displayOptions.minRowHeight, maxRowHeight 에 맞게 행 높이가 변경된다.

  • refresh: boolean

    기본값: true, 변경한 행 높이를 바로 화면에 반영할 것인지의 여부

상세 설명

displayOptions.eachRowResizable: true로 지정되어 있어야 한다.

예제 코드

gridView.setRowHeight(2, 40);

setRowIndicator


setRowIndicator(value:RowIndicator):void

그리드 인디케이터와 관련된 설정 정보들을 RowIndicator 모델로 설정한다.

매개변수

  • value: RowIndicator

    RowIndicator 모델과 같은 정보. 변경하고자 하는 속성만 전달하면 된다.

예제 코드

gridView.setRowIndicator({zeroBase: true});

setRowStyleCallback


setRowStyleCallback(f:RowStyleCallback):void

행 스타일을 변경한다.

매개변수

예제 코드

const f = function(grid, item, fixed) {
     if (fixed) {
         return 'custom-fixed-row';
     }
     else {
         return 'custom-data-row';
     }
}
gridView.setRowStyleCallback(f)

setSelection


setSelection(item:Selection):void

그리드에서 선택할 영역을 지정한다.

매개변수

  • item: Selection

    Selection 모델과 같은 설정 정보. 선택하고자 하는 영역의 속성만 전달하면 된다.

예제 코드

let sel = {
     style: "block",
     startItem: 2,
     startRow: 2,
     startColumn: "지목",
     endItem: 3,
     endRow: 3,
     endColumn: "단위"
}
gridView.setSelection(sel);

setSortingOptions


setSortingOptions(options:SortingOptions):void

그리드 정렬과 관련된 정보들을 SortingOptions 모델로 설정한다.

매개변수

상세 설명

ToastOptions 는 속성으로 직접 접근해서 수정해야한다.

예제 코드

gridView.setSortingOptions({enabled: false});

setStateBar


setStateBar(value:StateBar):void

그리드 상태바의 설정 정보를 StateBar 의 모델로 설정한다.

매개변수

  • value: StateBar

    StateBar 모델과 같은 정보. 변경하고자 하는 속성만 전달하면 된다.

예제 코드

gridView.setStateBar({errorVisible: true});

setTopItem


setTopItem(itemIndex:number):void

그리드 맨 위에 지정한 행으로 위치한다.

매개변수

  • itemIndex: number

    기본값: 0, 그리드 상단에 위치하고자 하는 행의 인덱스

예제 코드

gridView.setTopItem();

setValidations


setValidations(value:EditValidation[] | EditValidation | string | string[]):void

행 수준의 편집 검증 조건의 목록을 설정한다.

매개변수

예제 코드

// 문자열
gridView.setValidations("values['UnitPrice'] > 100");

// 오브젝트
gridView.setValidations({
     message: 'Too expensive!',
     criteria: "values['UnitPrice'] > 100"
})

// 배열
gridView.setValidations([{
     message: 'Too expensive!',
     criteria: "values['UnitPrice'] > 100"
}])

setValue


setValue(itemIndex:number,field:string | number,value:any):void

행의 순서와 데이터 필드 인덱스로 지정되는 데이터 셀의 값을 변경한다.

매개변수

  • itemIndex: number

    행의 순서

  • field: string | number

    필드 인덱스 또는 필드명

  • value: any

    필드에 설정할 값

상세 설명

그리드가 편집 중인 경우 편집 중인 itemIndex 의 값만 변경할수 있으며 편집이 완료된후 dataProvider에 값이 반영되고 편집중이 아닌경우 dataProvider에 즉시 반영된다.

예제 코드

gridView.setValue(3, 'UnitPrice', 52);

setValues


setValues(itemIndex:number,values:any[] | object,strict:boolean):void

지정한 행의 여러 필드의 값을 수정한다.

매개변수

  • itemIndex: number

    정보를 가져올 행의 인덱스

  • values: any[] | object

    수정할 필드의 데이터 값들

  • strict: boolean

    기본값: false, true 일때 필드의 값을 undefined 로 지정한 경우 기존의 값을 유지한다.

예제 코드

gridView.setValues(3, [123, 142, 'happy', 133]);

setVisible


setVisible(value:boolean):void

그리드를 표시하거나 감춘다.

매개변수

  • value: boolean

    true: 그리드 표시, false: 그리드 감추기

예제 코드

gridView.setVisible(false);

showEditor


showEditor(dropdown:boolean):void

현재 위치한 셀에서 그리드의 편집기를 표시한다.

매개변수

  • dropdown: boolean

상세 설명

그리드가 편집 불가 상태(editable: false)라면 편집기는 표시되지 않는다.

예제 코드

gridView.showEditor();

showLoading


showLoading(disabled:boolean):void

로딩 애니메이션을 표시한다.

매개변수

  • disabled: boolean

    true이면 마우스와 키보드의 동작을 막는다. - 기본값: false,

예제 코드

gridView.showLoading();

showProgress


showProgress():void

프로그레스 바를 표시한다.

상세 설명

진척 상태를 알리는 Progress Bar를 화면에 표시한다.

진척 값과 문자열 정보는 setProgress()를 통해 설정한다.

예제 코드

gridView.showProgress();

showToast


showToast(options:ToastOptions,force:boolean):void

Toast 팝업 창을 표시한다.

매개변수

  • options: ToastOptions

    메시지와 메시지 표시여부를 지정, ToastOptions 와 같은 모델의 오브젝트. 기본적으로 메시지만 지정해도 된다.

  • force: boolean

    기존 toast 창이 표시되어 있을때 강제로 다시 표시 여부를 지정한다.

    let config = {
         message: 'Toast!'
    }
    gridView.showToast(config, true);
    

toggleAllColumnFilters


toggleAllColumnFilters(column:string | DataColumn):void

해당 컬럼의 지정한 모든 필터들을 토글한다.

매개변수

  • column: string | DataColumn

    해당하는 컬럼의 이름 또는 컬럼 객체

예제 코드

gridView.toggleAllColumnFilters('행정구역별', ['전']);

toggleColumnFilters


toggleColumnFilters(column:string | DataColumn,filterNames:string | string[]):void

해당 컬럼의 지정한 필터들을 토글한다.

매개변수

  • column: string | DataColumn

    해당하는 컬럼의 이름 또는 컬럼 객체

  • filterNames: string | string[]

    토글할 필터의 이름 혹은 필터들의 이름의 배열

예제 코드

gridView.toggleColumnFilters('행정구역별', ['전', '답']);

undo


undo():boolean

그리드에 연결되어 있는 datasource를 이전 상태로 되돌린다.

반환값

타입: boolean

예제 코드

gridView.undo();

unregisterAllCustomRenderer


unregisterAllCustomRenderer():void

모든 사용자 지정의 렌더러를 등록 해제 한다.

예제 코드

gridView.unregisterAllCustomRenderer('Renderer01');

unregisterCustomRenderer


unregisterCustomRenderer(type:string):void

사용자 지정의 렌더러를 등록 해제 한다.

매개변수

  • type: string

    해제 할 렌더러 종류 (이름)

예제 코드

gridView.unregisterCustomRenderer('Renderer01');

validateCells


validateCells(itemIndices:number[],visibleOnly:boolean):object

입력시 검증하는 것이 아닌 그리드에 있는 데이터들을 대상으로 일괄로 검증을 수행한다.

매개변수

  • itemIndices: number[]

    그리드의 행 인덱스들, null로 지정하면 그리드 전체 행을 대상으로 검증을 수행

  • visibleOnly: boolean

    기본값: true, false 이면 트리 그리드의 접혀있는 노드 등 보이지 않는 행들도 검증 대상에 포함한다. false는 전체 행을 체크하는 경우에만 적용한다.

반환값

타입: object

검증에 실패한 셀 정보들

상세 설명

column validation을 사용하여 검증을 수행하며 row validation은 하지 않는다.

예제 코드

gridView.validateCells(null, false);

콜백 정보

onCellButtonClicked


onCellButtonClicked: (grid: GridBase, index: CellIndex, column: GridColumn) => void

사용자가 데이터 셀 내부의 action 버튼을 클릭했을 때 호출한다.

상세 설명

[매개변수 목록]

grid - GridBase 컨트롤

index - 데이터 셀이 포함된 아이템의 위치정보

column - 데이터 셀에 연결된 컬럼

기본 값

null

예제 코드

gridView.onCellButtonClicked =  function (grid, index, col) {
     console.log(index);
};

onCellClicked


onCellClicked: (grid: GridBase, clickData: ClickData) => void

그리드 셀이 클릭되었음을 알리는 콜백

상세 설명

[매개변수 목록]

grid - GridBase 컨트롤

clickData - 클릭된 셀 정보

기본 값

null

예제 코드

gridView.onCellClicked = function (grid, clickData) {
     console.log(clickData);
}

onCellDblClicked


onCellDblClicked: (grid: GridBase, clickData: ClickData) => void

그리드 셀이 더블 클릭되었음을 알리는 콜백

상세 설명

[매개변수 목록]

grid - GridBase 컨트롤

clickData - 클릭된 셀 정보

기본 값

null

예제 코드

gridView.onCellDblClicked = function (grid, clickData) {
     console.log(clickData);
}

onCellEdited


onCellEdited: (grid: GridBase, itemIndex: number, row: number, field: number) => void

수정이나 추가 중인 편집 아이템의 한 필드값이 편집 완료되었음을 알리는 콜백

상세 설명

[매개변수 목록]

grid - GridBase 컨트롤

itemIndex - 편집 중인 행의 순서

row - 편집 중인 행의 고유 번호

field - 방금 편집된 필드의 인덱스

기본 값

null

예제 코드

gridView.onCellEdited = function (grid, itemIndex, row, field) {
     console.log('Edit done! at ' + itemIndex + ', ' + field);
}

onCellItemClicked


onCellItemClicked: (grid: GridBase, index: CellIndex, clickData: ClickData) => boolean

그리드 셀에 포함된 엘리먼트가 클릭되었음을 알리는 콜백

상세 설명

이 이벤트 내에서 클릭을 처리했다면 반드시 true를 리턴해야 element의 기본 동작을 실행하지 않는다.

[매개변수 목록]

grid - GridBase 컨트롤

index - 클릭된 데이터 셀의 위치정보

clickData - 클릭된 셀 정보

기본 값

null

예제 코드

gridView.onCellItemClicked = function (grid, index, clickData) {
     console.log(clickData);
     return true;
}

onCellPasting


onCellPasting: (grid: GridBase, index: CellIndex, value: any) => boolean

셀에 붙여넣기를 결정하는 콜백

상세 설명

[매개변수 목록]

grid - GridBase 컨트롤

index - 클릭된 데이터 셀의 위치정보

value - 붙여넣기 중인 데이터 값

[반환값] - false를 반환하면 그 셀에는 붙여넣기가 되지 않는다.

기본 값

null

예제 코드

gridView.onCellPasting = function (grid, index, value) {
     if (value === 'hello') {
         return false;
     }
};

onColumnCheckedChanged


onColumnCheckedChanged: (grid: GridBase, column: GridColumn, checked: boolean) => void

사용자의 컬럼 헤더 체크박스를 클릭을 알리는 콜백

상세 설명

[매개변수 목록]

grid - GridBase 컨트롤

column - 컬럼 오브젝트

checked - 체크 여부

기본 값

null

예제 코드

gridView.onColumnCheckedChanged =  function (grid, col, chk) {
     console.log(col.name + "was checked as: " + chk);
};

onColumnPropertyChanged


onColumnPropertyChanged: (grid: GridBase, column: GridColumn, property: string, value: any, oldValue: any) => void

컬럼의 속성 중 width, displayIndex, visible 속성값이 변경되었음을 알리는 콜백

상세 설명

[매개변수 목록]

grid - GridBase 컨트롤

column - 변경된 컬럼의 정보

property - 컬럼의 width, displayIndex, visible 속성 중 변경된 것

value - 변경된 값이 전달된다.

기본 값

null

예제 코드

gridView.onColumnPropertyChanged = function (grid, column, property, value) {

        console.log(column + "s props werer changed!");
}

onCommandStackChanged


onCommandStackChanged: (grid: GridBase, undoable: boolean, redoable: boolean) => void

CommandStack이 바뀌었음을 알리는 콜백

상세 설명

[매개변수 목록]

grid - GridBase 컨트롤

undoable - 뒤로

redoable - 앞으로

기본 값

null

예제 코드

gridView.onCommandStackChanged =  function (grid, undoable, redoable) {
     if (undoable === true) {
         console.log('You can undo now!');
     }
};

onContextMenuItemClicked


onContextMenuItemClicked: (grid: GridBase, item: MenuItem, clickData: ClickData) => void

setContextMenu() 를 통해 추가한 컨텍스트 메뉴 항목 클릭을 알리는 콜백

상세 설명

[매개변수 목록]

grid - GridBase 컨트롤

item - 클릭된 메뉴 항목의 정보

clickData - 클릭 된 아이템의 정보

기본 값

null

예제 코드

gridView.onContextMenuItemClicked =  function (grid, item, clickData) {
     console.log(clickData);
};

onContextMenuPopup


onContextMenuPopup: (grid: GridBase, x: number, y: number, clickData: ClickData) => boolean | string

좌표와 함께 ContextMenu 표시를 결정하는 콜백

상세 설명

[매개변수 목록]

grid - GridBase 컨트롤

x - ContextMenu 가 호출된 x좌표값

y - ContextMenu 가 호출된 y좌표값

clickData - 클릭 된 아이템의 정보

[반환값] - false를 반환하면 컨텍스트 메뉴가 표시되지 않는다. 또 menuName을 return하는 경우 해당 menu가 표시된다.

기본 값

null

예제 코드

gridView.onContextMenuPopup =  function (grid, x, y, clickData) {
     console.log(clickData);
};

onCopy


onCopy: (grid: GridBase, selection: Selection, event: ClipboardEvent) => boolean

control + c 키로 복사하기를 결정하는 콜백

상세 설명

[매개변수 목록]

grid - GridBase 컨트롤

selection - 선택 영역 정보

event - 이벤트 정보 (ClipboardEvent)

[반환값] - false를 반환하면 복사하기가 취소된다.

기본 값

null

예제 코드

gridView.onCopy = function(grid, selection, event) {
     let data = JSON.stringify(grid.getSelectionData());
     if (data) {
     	data = 'onCopy
' + data;
     	if (window.clipboardData) {
     		window.clipboardData.setData("Text", data);
     	} else {
     		event.clipboardData.setData('text/plain', data);
     	}
     }
     return false;
}

onCurrentChanged


onCurrentChanged: (grid: GridBase, newIndex: CellIndex) => void

그리드의 focus cell 의 위치 변경을 알리는 콜백

상세 설명

변경되기 직전에는 onCurrentChanging 을 호출

[매개변수 목록]

grid - GridBase 컨트롤

newIndex - 변경된 셀 위치정보

기본 값

null

예제 코드

gridView.onCurrentChanged =  function (grid, newIndex) {
     console.log(newIndex);
}

onCurrentChanging


onCurrentChanging: (grid: GridBase, oldIndex: CellIndex, newIndex: CellIndex) => boolean

그리드의 focus cell 의 위치 변경을 결정하는 콜백

상세 설명

변경된 후에는 onCurrentChanged 를 호출한다.

[매개변수 목록]

grid - GridBase 컨트롤

oldIndex - 변경 전 셀 위치정보

newIndex - 변경 되는 셀 위치정보

[반환값] - callback 함수에서 명시적으로 false를 반환하면 current가 변경되지 않음

기본 값

null

예제 코드

gridView.onCurrentChanging =  function (grid, oldIndex, newIndex) {
     console.log(oldIndex);
     console.log(newIndex);
     // return false; 를 하는 경우 위치 변경이 되지 않는다.
};

onCurrentRowChanged


onCurrentRowChanged: (grid: GridBase, oldRow: number, newRow: number) => void

데이터 행의 위치가 변경됨을 알리는 콜백

상세 설명

onCurrentChanged의 경우 선택된 cell의 itemIndex가 변경되는 경우 발생된다. 그러나 onCurrentRowChanged 의 경우 선택된 cell의 데이터 행의 index가 변경되는 경우에 발생한다.

[매개변수 목록]

grid - GridBase 컨트롤

oldRow - 변경 전 데이터 행의 위치

newRow - 변경 후 데이터 행의 위치, -1인 경우 신규행이거나 또는 dataProvider가 비워진 경우이다.

기본 값

null

예제 코드

gridView.onCurrentRowChanged =  function (grid, oldRow, newRow) {
     console.log(oldRow);
     console.log(newRow);
     // return false; 를 하는 경우 위치 변경이 되지 않는다.
};

onEditCanceled


onEditCanceled: (grid: GridBase, index: CellIndex) => void

사용자가 편집중 ESCAPE 키를 입력하거나 cancel() 이 호출되어 편집이 취소됨을 알리는 콜백

상세 설명

[매개변수 목록]

grid - GridBase 컨트롤

index - 편집이 취소된 데이터 셀의 위치정보

기본 값

null

예제 코드

gridView.onEditCommit = function (grid, index) {
     console.log("Edit Cannceled at " + index.column);
}

onEditChange


onEditChange: (grid: GridBase, index: CellIndex, value: any) => void

아이템이 사용자의 Key 입력 등으로 값이 변경되었음을 알리는 콜백

상세 설명

[매개변수 목록]

grid - GridBase 컨트롤

index - 현재 focus 된 셀의 위치정보

value - 편집 중인 셀의 데이터 값

기본 값

null

예제 코드

gridView.onEditChange = function (grid, index, value) {
     console.log("grid.onEditChange driven, " + index.column + ' at ' + index.dataRow + ' was replaced by value: ' + value);
}

onEditCommit


onEditCommit: (grid: GridBase, index: CellIndex, oldValue: any, newValue: any) => boolean

사용자 입력이 셀에 반영함을 결정하는 콜백

상세 설명

편집 중인 셀에서 다른 셀로 이동하거나 또는 commitEditor() 를 호출하면 발생한다. setValue() 등 사용자 코드로 변경될때는 발생하지 않는다.

[매개변수 목록]

grid - GridBase 컨트롤

index - 변경된 셀의 위치 정보

oldValue - 편집전 셀의 데이터 값

newValue - 편집후 셀의 데이터 값

[반환값] - false 를 반환 시 셀에 반영되지 않는다.

기본 값

null

예제 코드

gridView.onEditCommit = function (grid, index, oldValue, newValue) {
     if (newValue === '') {
         return false;
     }
     console.log(oldValue + 'was changed to ' + newValue);
}

onEditRowChanged


onEditRowChanged: (grid: GridBase, itemIndex: number, row: number, field: number, oldValue: any, newValue: any) => void

사용자 입력으로 변경된 값이 행에 반영되었음을 알리는 콜백

상세 설명

pasteOptions.noEditEventtrue 면 발생하지 않는다.

[매개변수 목록]

grid - GridBase 컨트롤

itemIndex - 변경된 행의 순서

row - 변경된 행의 고유 번호

field - 변경된 필드의 인덱스

oldValue - 편집전 셀의 데이터 값

newValue - 편집후 셀의 데이터 값

기본 값

null

예제 코드

gridView.onEditRowChanged = function (grid, itemIndex, dataRow, field, oldValue, newValue) {
    let v = grid.getValue(itemIndex, field);
    console.log("onEditRowChanged, " + field + ": " + oldValue + " => " + newValue);
};

onEditRowPasted


onEditRowPasted: (grid: GridBase, itemIndex: number, row: number, fields: number[], oldValues: any[], newValues: any[]) => void

그리드 셀에 붙여넣기 했음을 알리는 콜백

상세 설명

여러 행을 붙여넣기 할때는 onRowsPasted 참조

[매개변수 목록]

grid - GridBase 컨트롤

itemIndex - 변경된 행의 순서

row - 변경된 행의 고유 번호

fields - 필드의 인덱스들

oldValues - 편집전 셀의 데이터 값들

newValues - 편집후 셀의 데이터 값들

기본 값

null

예제 코드

gridView.onEditRowPasted = function (grid, itemIndex, row, fields, oldValues, newValues) {
    console.log('Row pasted!: {' + newValues.join() + '}');
};

onEditSearch


onEditSearch: (grid: GridBase, index: CellIndex, text: string) => void

검색을 했음을 알리는 콜백

상세 설명

SearchCellEditor에서 searchLenghtsearchDelay 조건이 만족하면 발생한다. 또는 Ctrl+Enter 키 또는 Enter 키를 입력시 발생한다.

[매개변수 목록]

grid - GridBase 컨트롤

index - 변경된 셀 위치정보

text - 셀에 입력된 값

기본 값

null

예제 코드

gridView.onEditSearch = function (grid, index, text) {
     console.log(text + ' was searched!');
}

onErrorClicked


onErrorClicked: (grid: GridBase, error: string) => void

그리드에 발생한 에러창을 클릭했음을 알리는 콜백

상세 설명

[매개변수 목록]

grid - GridBase 컨트롤

error - 에러 메세지

기본 값

null

예제 코드

gridView.onErrorClicked = function (grid, error) {
    console.log(error);
}

onFiltering


onFiltering: (grid: GridBase) => boolean

필터링을 결정하는 콜백

상세 설명

[매개변수 목록]

grid - GridBase 컨트롤 [반환값] - 기본값: true, 필터링 실행 여부를 지정한다. false 를 반환하면 필터링은 취소된다.

기본 값

null

예제 코드

gridView.onFiltering = function (grid) {
     return false;
}

onFilteringChanged


onFilteringChanged: (grid: GridBase, column: GridColumn, filter: ColumnFilter) => void

컬럼에 필터들이 설정되어 있고, 그 필터의 상태가 변경되었음을 알리는 콜백

상세 설명

[매개변수 목록]

grid - GridBase 컨트롤

column - 필터링된 컬럼 정보

filter - 해당 필터의 정보

기본 값

null

예제 코드

gridView.onFilteringChanged = function (grid, column, filter) {
     console.log('Filter changed!');
}

onGetEditValue


onGetEditValue: (grid: GridBase, index: CellIndex, editResult: Object) => void

셀 편집이 완료되었을 때 셀의 위차와 편집결과를 갖고 있는 콜백

상세 설명

DropDownCellEditor, SearchCellEditor, MultiCheckCellEditor의 경우 editResult.text에는 labels에 해당하는 값이 출력되고 editResult.value에는 values에 해당하는 값이 출력된다.

DateCellEditor의 경우에는 editResult.text에는 editor의 datetimeFormat으로 Formatting된 값이 출력되고 editResult.value에는 Date객체가 출력된다.

다른 Editor의 경우 text와 value에 동일한 값이 출력된다.

EditResult 의 형태로 출력된다.

[매개변수 목록]

grid - GridBase 컨트롤

index - 편집된 셀의 위치정보

editResult - 편집된 셀의 text와 value를 속성으로 갖는 단순한 객체, 셀 편집기의 종류에 따라 출력되는 값이 달라진다.

기본 값

null

예제 코드

gridView.onGetEditValue = function (grid, index, editResult) {
     console.log(editResult);
}

onGridActivated


onGridActivated: (grid: GridBase) => void

그리드가 선택되었음을 알리는 콜백

상세 설명

grid를 전역변수에 저장해서 사용하는 것이 좋다.

[매개변수 목록]

grid - GridBase 컨트롤

기본 값

null

예제 코드

gridView.onGridActivated = function (grid) {
     alert('Selected!');
}

onHideEditor


onHideEditor: (grid: GridBase, index: CellIndex) => void

편집이 완료되고 편집기가 사라진 것을 알리는 콜백

상세 설명

[매개변수 목록]

grid - GridBase 컨트롤

index - 편집된 셀의 위치정보

기본 값

null

예제 코드

gridView.onHideEditor = function (grid, index) {
     console.log("onHideEditor:" + index.itemIndex + "," + index.column);
}

onItemAllChecked


onItemAllChecked: (grid: GridBase, checked: boolean) => void

사용자가 checkBar의 Header를 클릭하여 전체선택, 해제를 하거나 또는 checkAll true / false 을 입력하여 전체선택, 해제를 했음을 알리는 콜백

상세 설명

[매개변수 목록]

grid - GridBase 컨트롤

checked - 체크가 되었으면 true, 해제가 되었으면 false가 출력

기본 값

null

예제 코드

gridView.onItemAllChecked = function (grid, checked) {
    console.log('All checked as ' + checked);
};

onItemChecked


onItemChecked: (grid: GridBase, itemIndex: number, checked: boolean) => void

사용자가 checkBar의 체크박스를 클릭하거나 checkItem을 호출하여 체크를 변경했음을 알리는 콜백

상세 설명

[매개변수 목록]

grid - GridBase 컨트롤

itemIndex - 체크된 데이터 행의 순서

checked - 체크가 되었으면 true, 해제되었으면 false가 출력

기본 값

null

예제 코드

gridView.onItemChecked = function (grid, itemIndex, checked) {
    console.log('Checked as ' + checked + ' at ' + itemIndex);
};

onItemEditCancel


onItemEditCancel: (grid: GridBase, itemIndex: number, state: string) => boolean

사용자가 행 편집을 취소를 결정하는 콜백

상세 설명

[매개변수 목록]

grid - GridBase 컨트롤

itemIndex - 편집이 취소된 행의 순서

state - 편집 취소된 행의 상태이다. updating, inserting, appending 이 반환된다.

[반환값] - 기본값: true, false 를 반환하면 행 편집 취소가 취소된다. (계속 편집 상태)

기본 값

null

예제 코드

gridView.onItemEditCancel = function (grid, itemIndex, state) {
     console.log(state);
     if (itemIndex % 5 === 0) {
         return false;
     }
}

onItemEditCanceled


onItemEditCanceled: (grid: GridBase, itemIndex: number, state: string) => void

사용자가 행 편집을 취소했음을 알리는 콜백

[매개변수 목록]

grid - GridBase 컨트롤

itemIndex - 편집이 취소된 행의 순서

state - 편집 취소된 행의 상태

예제 코드

gridView.onItemEditCanceled = function (grid, itemIndex, state) {
     console.log(state);
}

onItemsChecked


onItemsChecked: (grid: GridBase, items: number[], checked: boolean) => void

사용자가 checkBar의 체크박스를 클릭하거나 checkItem을 호출하여 체크를 변경했음을 알리는 콜백

상세 설명

[매개변수 목록]

grid - GridBase 컨트롤

items - 체크된 데이터 행의 순서

checked - true: 체크, false: 해제

기본 값

null

예제 코드

gridView.onItemsChecked = function (grid, items, checked){
    console.log(items.join() + ' are checked as ' + checked);
}

onKeyDown


onKeyDown: (grid: GridBase, event: KeyboardEvent) => boolean

키 입력을 결정하는 콜백

상세 설명

KeyDown 될 때 발생한다. 키를 입력하고 있는 동안 계속 발생된다.

[매개변수 목록]

grid - GridBase 컨트롤

event - KeyboardEvent

[반환값] - 키 입력을 금지할때 false 를 반환한다/

기본 값

null

예제 코드

gridView.onKeyDown = function (grid, event) {
     console.log('You pressed... ' + "event);
}

onKeyPress


onKeyPress: (grid: GridBase, event: KeyboardEvent) => void

키가 입력되고 있음을 알리는 콜백

상세 설명

KeyPress 될 때 발생한다. 키를 입력하고 있는 동안 계속 발생된다.

[매개변수 목록]

grid - GridBase 컨트롤

event - KeyboardEvent

기본 값

null

예제 코드

gridView.onKeypross = function (grid, event) {
     console.log('You are pressing... ' + event);
}

onKeyUp


onKeyUp: (grid: GridBase, event: KeyboardEvent) => void

키를 입력하였음을 알리는 콜백.

상세 설명

KeyUp 될 때 발생한다.

[매개변수 목록]

grid - GridBase 컨트롤

event - KeyboardEvent

기본 값

null

예제 코드

gridView.onKeyUp = function (grid, event) {
     console.log('You pressed... ' + "event);
}

onMenuItemClicked


onMenuItemClicked: (grid: GridBase, item: MenuItem, clickData: ClickData) => void

추가한 팝업메뉴 항목의 클릭을 알리는 콜백

상세 설명

MenuItem에 callback 이 지정된 경우 호출되지 않는다.

[매개변수 목록]

grid - GridBase 컨트롤

item - MenuItem 객체

clickData - 클릭 된 아이템의 정보

기본 값

null

예제 코드

gridView.onMenuItemClicked =  function (grid, item, clickData) {
     console.log(item.label + "was clicked.");
};

onPaste


onPaste: (grid: GridBase, index: CellIndex, event: ClipboardEvent) => boolean

그리드에 붙여넣기를 결정하는 콜백

상세 설명

[매개변수 목록]

grid - GridBase 컨트롤

index - 셀 위치정보

event - 이벤트 정보 (ClipboardEvent)

[반환값] - false를 반환하면 붙여넣기가 취소된다.

기본 값

null

예제 코드

gridView.onPaste = function (grid, index, event){
    console.log("Pasting Starts!");
}

onPasted


onPasted: (grid: GridBase) => void

그리드에 붙여넣기 했음을 알리는 콜백

상세 설명

입력 편집기가 표시된 상태에서는 발생하지 않는다.

[매개변수 목록]

grid - GridBase 컨트롤

기본 값

null

예제 코드

gridView.onPasted = function (grid){
    console.log("Pasted!");
}

onRowInserting


onRowInserting: (grid: GridBase, itemIndex: number, dataRow: number) => boolean

사용자가 Insert 키를 눌러 새로운 행을 삽입하거나, 마지막 행에서 아래 화살표를 눌러 행을 추가하는 것을 결정하는 콜백

상세 설명

[매개변수 목록]

grid - GridBase 컨트롤

itemIndex - 행 삽입 위치의 순서

dataRow - 행 삽입 위치의 고유 id

[반환값] - 행 추가를 금지 시킬 때 사용자에게 표시할 메시지

기본 값

null

예제 코드

gridView.onRowInserting = function (grid, itemIndex, dataRow) {
     console.log('Inserted: ' + dataRow + ' at ' + itemIndex);
}

onRowsDeleting


onRowsDeleting: (grid: GridBase, rows: number[]) => boolean

사용자가 Ctrl+Del 키를 누르거나 deleteSelection() 으로 삭제할 때, 실제 삭제를 결정하는 콜백

[매개변수 목록]

grid - GridBase 컨트롤

rows - 삭제하려는 행들의 데이터 행 순서들의 배열

[반환값] - null이 아닌 값을 반환하면 지정 텍스트를 표시하고 삭제를 취소한다.

기본 값

null

예제 코드

gridView.onRowsDeleting = function (grid, rows) {
     console.log('Deleted: ' + rows.join());
}

onRowsPasted


onRowsPasted: (grid: GridBase, items: number[]) => void

여러 행을 붙여넣기 했음을 알리는 콜백

상세 설명

[매개변수 목록]

grid - GridBase 컨트롤

items - 붙여넣기된 행들의 그리드에서의 순서

기본 값

null

예제 코드

gridView.onRowsPasted = function (grid, items) {
    console.log('Rows pasted!: ' + items.join());
};

onScrollToBottom


onScrollToBottom: (grid: GridBase) => void

사용자가 키보드나 스크롤 바 등을 조작하여 그리드에 마지막 행이 표시될 때 호출되는 콜백

상세 설명

[매개변수 목록]

grid - GridBase 컨트롤

기본 값

null

예제 코드

gridView.onScrollToBottom =  function (grid) {
    var data = {"SearchKey":"searchData"},
    $.ajax({
        url:"/loadData.do",
        data: data,
        type:"post",
        async:false,
        success: function (data, textStatus) {
            grid.fillJsonData(data.dataList, {fillMode:"append"});
        }
    })
});

onSearchCellButtonClick


onSearchCellButtonClick: (grid: GridBase, index: CellIndex, text: string) => void

SearchCellEditor 에서 버튼을 클릭했음을 알리는 콜백

상세 설명

[매개변수 목록]

grid - GridBase 컨트롤

index - 클릭된 셀 위치정보

text - 셀에 입력된 값

기본 값

null

예제 코드

gridView.onSearchCellButtonClick = function (grid, index, text) {
     console.log(text + ' button was clicked!');
}

onSelectionAdded


onSelectionAdded: (grid: GridBase, selection: Selection) => void

선택 영역이 새로 추가됨을 알리는 콜백

상세 설명

변경 중인 선택 영역의 정보는 getSelectionData 함수로 알 수 있다. GridBase.getSelection().styleSelectionStyle.NONE 인 경우 발생하지 않는다.

[매개변수 목록]

grid - GridBase 컨트롤

selection - 선택 영역 정보

기본 값

null

예제 코드

gridView.onSelectionAdded = function (grid, selection) {
     console.log(selection);
}

onSelectionChanged


onSelectionChanged: (grid: GridBase) => void

사용자가 마우스나 키보드로 선택 영역의 크기를 변경했음을 알리는 콜백

상세 설명

변경 중인 선택 영역의 정보는 getSelectionData 함수로 알 수 있다. GridBase.getSelection().styleSelectionStyle.NONE 인 경우 발생하지 않는다.

[매개변수 목록]

grid - GridBase 컨트롤

기본 값

null

예제 코드

gridView.onSelectionChanged = function (grid) {
     console.log('Selection changed!');
}

onSelectionEnded


onSelectionEnded: (grid: GridBase) => void

사용자가 마우스나 키보드로 선택 영역 변경을 했음을 알리는 콜백

상세 설명

변경된 선택 영역의 정보는 getSelection 함수로 알수 있고 선택영역의 데이터는 getSelectionData 함수로 알 수 있다.

[매개변수 목록]

grid - GridBase 컨트롤

기본 값

null

예제 코드

gridView.onSelectionEnded = function (grid) {
     let cells = grid.getSelectionData();
     console.log(cells);
}

onShowEditor


onShowEditor: (grid: GridBase, index: CellIndex, props: any, attrs: any) => boolean

Cell 별로 열리는 Editor 의 표시를 결정하는 콜백

상세 설명

[매개변수 목록]

grid - GridBase 컨트롤

index - 편집기가 열리려는 셀의 위치정보

props - 셀 편집기 설정 정보

attrs - 내부 편집기 element attributes. 사용자가 임의로 지정할 수 있는 값들.

[반환값] - false 를 return하면 Editor가 표시되지 않는다.

기본 값

null

예제 코드

gridView.onShowEditor = function (grid, index, props, attrs) {
     console.log("onShowEditor:" + index.itemIndex + "," + index.column);
     if (index.column == "OrderID") {
	        props.textCase = 'upper';
     }
}

onShowHeaderTooltip


onShowHeaderTooltip: (grid: GridBase, column: GridColumn, value: any) => any

컬럼 헤더의 툴팁이 표시되었음을 알리는 콜백

상세 설명

[매개변수 목록]

grid - GridBase 컨트롤

column - 툴팁이 표시될 컬럼

value - 툴팁에 표시될 값. 기본값으로 컬럼헤더 text가 전달된다.

[반환값] - 툴팁에 표시할 값. 아무것도 return 하지 않으면 컬럼명과 데이터 셀 값이 툴팁에 표시된다.

기본 값

null

예제 코드

gridView.onShowHeaderTooltip = function (grid, index, value) {
    return 'header-tooltip: ' + value;
}

onShowTooltip


onShowTooltip: (grid: GridBase, index: CellIndex, value: any) => any

데이터 셀의 툴팁이 표시되었음을 알리는 콜백

상세 설명

[매개변수 목록]

grid - GridBase 컨트롤.

index - 마우스 포인터가 위치한 영역의 셀 위치정보

value - 마우스 포인터가 위치한 데이터

[반환값] - 툴팁에 표시할 값. 아무것도 return 하지 않으면 데이터 셀 값과 셀 정보가 툴팁에 표시된다.

기본 값

null

예제 코드

gridView.onShowTooltip = function (grid, index, value) {
     if (index % 7 === 0) {
             return '7-multiple Row!'
     }
}

onSorting


onSorting: (grid: GridBase, fields: number[], directions: string[]) => boolean

정렬을 결정하는 콜백

상세 설명

[매개변수 목록]

grid - GridBase 컨트롤

fields - 정렬하는 필드의 목록

direction - 각 필드에 대한 정렬 방식 목록

[반환값] - false 를 반환하면 정렬은 취소된다.

기본 값

null

예제 코드

gridView.onSorting = function (grid) {
     if (fields.length > 5) {
         return false;
     }
}

onSortingChanged


onSortingChanged: (grid: GridBase) => void

정렬했음을 알리는 콜백

상세 설명

[매개변수 목록]

grid - GridBase 컨트롤

기본 값

null

예제 코드

gridView.onSortingChanged = function (grid) {
    console.log('Sorted! ');
}

onTopIndexChanged


onTopIndexChanged: (grid: GridBase, itemIndex: number) => void

수직 스크롤 바의 위치가 변경됨을 알리는 콜백

상세 설명

[매개변수 목록]

grid - GridBase 컨트롤

itemIndex - 스크롤 중일때 그리드 상단에 표시되는 itemIndex 값

기본 값

null

예제 코드

gridView.onTopIndexChanged = function (grid, idx) {
     console.log(idx + "was changed!");
}

onValidateColumn


onValidateColumn: (grid: GridBase, column: GridColumn, inserting: boolean, value: any, itemIndex: number, dataRow: number) => ValidationError

셀 편집을 완료하고 다른 셀로 이동할때 Javascript를 통한 사용자 검증 결과를 결정하는 콜백

상세 설명

해당 컬럼 값에 문제가 있다면 검증 에러와 에러 메시지를 그리드에 반환값으로 전달한다.

levelmessage 값을 포함하는 오브젝트를 그리드에 전달하면 검증에 실패한 것으로 판단한다.

ValidationError 형태로 반환해야 한다.

[매개변수 목록]

grid - GridBase 컨트롤

column - 컬럼 오브젝트

inserting - true: 열 추가 중, false: 열 수정 중

value - 입력된 필드의 값

itemIndex - 셀편집된 행의 순서

dataRow - 셀편집된 행의 고유 번호.

[반환값] - ValidationError

기본 값

null

예제 코드

gridView.onValidateColumn =  function (grid, column, inserting, value, itemIndex, dataRow) {
     if (column.name != "Knock Knock") {
         return {
             level: 'warning';
             messsage: "It's a dad joke! Do not " + JSON.stringify(column);
         }
     }
};

onValidateRow


onValidateRow: (grid: GridBase, itemIndex: number, dataRow: number, inserting: boolean, values: any[]) => ValidationError

Javascript를 통한 행 단위 사용자 검증 결과를 결정하는 콜백

상세 설명

해당 행의 값들에 문제가 있다면 검증 에러와 에러 메시지를 그리드에 반환값으로 전달한다.

levelmessage 값을 포함하는 오브젝트를 그리드에 전달하면 검증에 실패한 것으로 판단한다.

ValidationError 형태로 반환해야 한다.

[매개변수 목록]

grid - GridBase 컨트롤

itemIndex - 검증하는 행의 순서

dataRow - 검증하는 행의 고유 번호

inserting - true: 열 추가 중, false: 열 수정 중

values - 입력된 필드들의 값

[반환값] - ValidationError

기본 값

null

예제 코드

gridView.onValidateRow =  function (grid, itemIndex, dataRow, inserting, values) {
     if (dataRow % 2 === 0) {
         return {
             level: 'info';
             messsage: "even!";
         }
     }
};

onValidationFail


onValidationFail: (grid: GridBase, itemIndex: number, column: GridColumn, error: ValidationError) => ValidationError

validation 실패시 발생하는 콜백

상세 설명

콜백함수에서 별도의 에러 처리가 가능하고, err 객체를 return 하면 자체 Validation 메세지가 표시되고 그 외의 경우 표시되지 않는다.

levelmessage 값을 포함하는 오브젝트를 그리드에 전달하면 검증에 실패한 것으로 판단한다.

ValidationError 형태로 반환해야 한다.

[매개변수 목록]

grid - GridBase 컨트롤

itemIndex - 검증하는 행의 인덱스

column - 컬럼 오브젝트

error - 검증 결과

[반환값] - ValidationError

기본 값

null

예제 코드

gridView.onValidationFail = function (grid, itemIndex, column, err) {
    console.log("onValidationFail:" + itemIndex + "," + JSON.stringify(column) + "," + JSON.stringify(err));
    if (column.name != "Mortal") {
        return err;
    }
}