Wijmo5 Flexgrid基础教程:DataMap

<Wijmo Enterprise下载>

在上一篇,我们了解了数据绑定。本文我们就来介绍flexgrid的一个重要功能:dataMap

flexgrid在winForm平台下有一个功能,叫做DataMap。对于flexgrid的某一列,显示的文字和存储的值不一致,就可以使用DataMap功能。这个功能在基于HTML5平台的flexgrid中也可以使用。本文使用的框架是纯JavaScript。

实现步骤如下:

1.创建字段

创建id和name两个字段,并且赋值。代码参考:

actions = [{ id: 3, name:  'Invite' },
{ id: 26, name:  'Finalize' },
{ id: 1, name:  'Withdraw' }],

2.创建数据源

创建数据源里的一个字段actionId,它的值是之前的id。代码参考:

for (var i = 0; i < countries.length; i++) {
data.push({
country: countries[i % countries.length],
actionId: actions[i % actions.length].id
});
}

3.DataMap创建关系

通过DataMap创建id和name的关系。代码参考:

var actionsMap = new wijmo.grid.DataMap(actions, "id""name");

4.设置dataMap

使用列的dataMap属性设置dataMap。代码参考:

var col = grid.columns.getColumn( 'actionId' );
col.dataMap = actionsMap;

到此,就实现了列的DataMap数据对应关系。

本文的详细源代码请下载:flexgrid_datamap.zip (72.90 kb) 

PS: 关于ComponentOne,这些产品你可以关注>>
本文转载自葡萄城


你可能感兴趣的:(Wijmo5 Flexgrid基础教程:DataMap)