SMART datagrid v1.4 > Examples

Back  Forward

Lookup Data  Example

DataColumn.lookupDisplaytrue로 지정되면 DataColumn.lookupValues, labelField, lookupSourceId 등의 설정으로 데이터셀에 표시될 값을 셀에 연결된 데이터필드 대신 다른 곳에서 값을 가져와 표시할 수 있다. 

먼저, Data Lookup 개요를 참조하는 것이 도움이 될 수 있다. 


1.LookupValues & LookupLabels

lookupValues에 하나 이상 값들이 설정되고, lookupLabels에 lookupValues의 항목 수 이상으로 설정되면, 해당 데이터셀의 값이 lookupValues의 항목 중에 존재하면 해당 위치의 lookupLabels 항목 값을 데이터셀을 표시하는 데 사용한다. 

아래 "제품명" 컬럼은 "제품아이디"와 동일한 "product_id" 필드에 연결됐지만, lookupValues와 lookupLabels가 설정됐다. "Lookup Display" 체크 상태에 따라 컬럼의 lookupDisplay 속성이 변경된다. 

 

Grid - 1
rows

2.Label Field

아래 그리드에서 "고객명" 컬럼은 fieldName 속성은 "customer_id"로 labelField 속성은 "customer_label"로 설정됐다. 컬럼의 lookupDisplay 속성이 false면 "고객아이디" 컬럼과 마찬가지로 "customer_id" 필드 값을 표시한다. 하지만, Lookup Display를 체크해서 컬럼의 lookupDisplay 속성을 true로 설정하면, labelField로 설정된 "customer_label" 필드의 값을 표시한다. 

Code -1
    chkLookupDisplay_click: function (ev) {
        var col = grdMain.columnByName('colCustName');
        if (col) {
            col.setLookupDisplay(ev.target.checked);
        }
    }

 

Grid - 2
rows

3.Lookup Tree

LookupTree는 여러 값으로 구성된 키와 키의 값을 계층적 구조로 저장하는 LookupSource 구현체이다. LookupTree 객체를 그리드에 등록하고 그 아이디를 컬럼의 lookupSourceId로 지정하고, lookupKeyFields에 룩업 key로 사용할 필드들을 지정하면, 컬럼의 데이터셀들은 LookupTree 객체로 부터 값을 가져와 표시하는 데 사용한다. 

아래 그리드에서 "제품 고객" 컬럼의 lookupSourceId가 그리드에 등록한 "prodCustomers" 룩업 소스로 지정되고, lookupKeyFields가 ["product_id", "customer_id"]로 설정됐다. 

LookupSource, LookupTree 도움말 토픽에서 자세한 설명을 참조한다. 

Code -2
    grdMain3.addLookupSource({
        id: "prodCustomers",
        levels: 2,
        keys: [
            ['PR_001', 'AAPL'],
            ['PR_002', 'MSFT'],
            ...
        ],
        values: [
            "PR_001_Apple",
            "PR_002_Microsoft",
            ...
        ]
    });    

 

Grid - 3
rows

소스보기 JSP 

See Also
Data Lookup 개요
lookupDisplay
Examples
Label Field
계산 필드
계산 컬럼