Lookup 컬럼

컬럼에 연결된 데이터 필드의 실제 값 대신 그 값과 연관된 다른 값을 셀에 표시할 수 있습니다.

values와 labels 설정

lookupDisplay속성을 true로 지정하고 values와 labels속성들의 목록을 지정하면 values값의 위치에 맞는 labels 항목이 표시됩니다.

values/labels 컬럼에 values로 설정된 값 중 하나를 입력해 보세요.

var columns = [{
    ...
}, {
    name: "UserName",
    fieldName: "UserName",
    type: "data",
    width: "130",
    sortable: false,
    lookupDisplay: true,
    values: ["VINET", "HANAR", "SUPRD", "VICTE", "THREE", "SEVEN"],
    labels: ["<VINET>", "<HANAR>", "<SUPRD>", "<VICTE>", "<THREE>", "<SEVEN>"],
    header: {
        text: "Values/Labels",
    }
}, {
    ...
}];

grid.setColumns(columns);

labelField 설정

해당 컬럼 셀에는 실제 값 대신 이 필드의 셀과 같은 행에 있는 labelField의 값을 표시합니다. 아래 컬럼은 'Age'필드의 값이 표시되는게 아니라 'AgeLabel'필드의 값이 표시됩니다.

var columns = [{
    ...
}, {
    name: "Age",
    fieldName: "Age",
    type: "data",
    width: "130",
    lookupDisplay: true,
    labelField: "AgeLabel", //label로 사용할 field설정
    header: {
        text: "Label Field",
    }
}, {
    ...
}];

grid.setColumns(columns);

Label Field컬럼 값 확인

alert(dataProvider.getFieldValues("Age"));

labelField 값 확인

alert(dataProvider.getFieldValues("AgeLabel"));

dropDown lookup 설정

values와 labels 목록은 DropDown 편집기의 lookup 목록으로 사용될 수도 있습니다.

var columns = [{
    ...
}, {
    name: "Gender",
    fieldName: "Gender",
    type: "data",
    width: "100",
    sortable: false,
    lookupDisplay: true,
    editor: {
        type: "dropdown",
        dropDownCount: 2,
        domainOnly: true,
        values: ["Male","Female"],
        labels: ["<Male>","<Female>"]
    },
    header: {
        text: "Gender"
    }
}, {
    ...
}];

grid.setColumns(columns);

value값 확인하기

현재 포커스 위치의 value값을 확인해보세요.

var focusIndex = gridView.getCurrent().itemIndex;
var focusField = gridView.getCurrent().fieldName;
alert(gridView.getValue(focusIndex, focusField));