[넥사크로] 그리드 컬럼 너비 변경하기, 숨기기

조회된 결과에 따라 혹은 이벤트 동작에 따라 그리드 상의 일부 컬럼사이즈를 변경하거나, 숨기는 등의 행동이 필요할 때 Grid00.setRealColSize() 메소드를 이용할 수 있다.

 

그리드정보

left 컬럼과 body로 이루어진 그리드를 생성해 함수를 적용시켜본다.

그리드편집창

초기상태

setRealColSize Syntax

Grid.setRealRowSize(enumBand, nColIndex, nSize, bBandIndex)

enumBand: 너비를 변경할 band ["left"||"body"||"right"]

nColIndex : 너비를 변경할 컬럼 인덱스, 0 부터 시작, -1 설정시 모든 컬럼

nSize : 컬럼의 너비

bBandIndex : nColIndex 인덱스 값의 기준. true인 경우 enumBand에 지정한 밴드기준, false인 경우 전체 컬럼기준

 

예제1

그리드 셀에 컬럼이 매핑되어있다면 아래와 같이 사용하면된다. 

var colNum = this.Grid00.getBindCellIndex("body", "컬럼명");
this.Grid00.setRealColSize("body", colNum, 300); //300px
this.Grid00.setRealColSize("body", colNum, 0);   //숨기기

 

예제2

컬럼이 매핑되어있지 않을 때는 정수를 컬럼 인덱스로 줄 수 있다. 이 때 마지막 속성 값의 true/false여부에 따라 지정되는 컬럼이 달라질 수 있으므로 유의해야한다.

 

아래는 마지막 속성 값을 디폴트값(false)로 주었을 때의 결과이다. body(첫번째 인자)영역 컬럼이 아닌 그리드 전체 컬럼을 카운트하기 때문에 0번째 컬럼(left영역)의 size가 변경되었다.

this.Grid00.setRealColSize("body", 0, 300);   
//this.Grid00.setRealColSize("body", 0, 300, false);

 

마지막 속성 값을 true로 지정하면 body영역의 시작 인덱스부터 카운트한다. 

this.Grid00.setRealColSize("body", 0, 300, true);

 

그리드 숨김처리 예시

this.Grid00.setRealColSize("body", 0, 0, true);

 

oncolresized 이벤트

this.Grid00.set_enableevent(false);

//그리드 head cell 개수만큼 반복
for(var i = 0; i < this.Grid00.getCellCount('head'); i++){
    this.Grid00.setRealColSize("body", i, 40, true);
}

this.Grid00.set_enableevent(true);

그리드 Column 너비변경시 oncolresized 이벤트가 call되면서 오버헤드가 발생한다. 반복문을 통해 컬럼 너비조정이 필요한 경우, 너비 변경으로 인한 oncolresized 이벤트 처리가 필요하지 않는 경우는 그리드 이벤트를 비활성화 함으로써 성능저하를 방지해줄 필요가 있다.