SMART datagrid v.1 > Examples

Back  Forward

Lookup Data  Example

If specify DataColumn.lookupDisplay as true, you can get the value from another place rather than the data field and display in the data cell by setting DataColumn.lookupValues, labelField, lookupSourceId, etc. 

First, please refer to Data Lookup Overview


1. LookupValues & LookupLabels

If set one or more values in lookupValues and more than the number of lookupValues items in lookupLabels, and if the value of the corresponding data cell exists in the items of lookupValues, lookupLabels item value of the corresponding location will be used to display the data cell. 

Although "Product name" column below has been connected to "product_id" field which is the same as "Product ID", lookupValues and lookupLabels have been set in it. lookupDisplay property of the column is changed according to the check state of "Lookup Display". 

 

Grid - 1
rows

2. Label Field

In "Customer name" column in the grid below, fieldName property has been set as "customer_id", and labelField property has been set as "customer_label". If lookupDisplay property of the column is false, it will display "customer_id" field value as well as "Customer ID" column. However, if check Lookup Display and set lookupDisplay property of the column as true, it will display "customer_label" field value set by labelField. 

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 is the embodiment of LookupSource which saves the key composed of several values as well as the value in a hierarchical structure. If register LookupTree object in the grid, specify its ID as lookupSourceId of the column, and specify the fields to be used as lookup key in lookupKeyFields, the data cells of the column will be used to get and display the value from LookupTree object. 

In the grid below, lookupSourceId of "Product Customer" column is specified as "prodCustomers" lookup source registered in the grid, and lookupKeyFields is set as ["product_id", "customer_id"]. 

Please refer to LookupSource and LookupTree help topics about more details. 

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

View Source JSP 

See Also
Data Lookup Overview
lookupDisplay
Examples
Label Field
Derived Fields
Calculated Columns