SMART datagrid v.1 > Examples

Back  Forward

Lookup Data  Example  準備中...

DataColumn.lookupDisplayがtrueに指定されたら DataColumn.lookupValues、labelField、lookupSourceIdなどの設定で データセルに表示される値をセルに繋がったデータフィールドの代わりに他のところで取得して表示することができる。 

まず、Data Lookup 概要を参考することが役に立つこともある。 


1.LookupValues & LookupLabels

lookupValuesに一つ以上の値たちが設定されて、 lookupLabelsにlookupValuesの項目の数以上に設定されたら、 該当データセルの値がlookupValuesの項目の中に存在すれば該当位置のlookupLabels項目の値をデータセルを表示することに使う。 

下の*"製品名"カラムは"製品ID"と同一の"product_id"フィールドに繋がったが、lookupValuesとlookupLabelsが設定されてある。 "Lookup Display"チェックの状態によってカラムのlookupDisplayプロパティーが変更になる。 

 

Grid - 1
rows

2.Label Field

下のグリッドで"取引先名"カラムはfieldNameプロパティーを"customer_id"に、labelFieldプロパティーは"customer_label"に設定する。 カラムのlookupDisplayプロパティーがfalseなら"取引先ID"カラムと同じであるように"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客体をグリッドに登録してそのIDをカラムの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

ソースを見る 

See Also
Data Lookup概要
lookupDisplay