Wijmo5 FlexGrid教程（2）- 使用数据对应DataMap功能

在上一篇，我们了解了数据绑定。

本文，我们就来介绍FlexGrid的一个重要功能：dataMap。

FlexGrid在winForm平台下有一个功能，叫做DataMap。对于FlexGrid的某一列，显示的文字和存储的值不一致，就可以使用DataMap的功能。这个功能在基于HTML5平台的FlexGrid，也可以使用。

本文使用的框架是纯JavaScript。

实现步骤：1.创建字段

创建id和name两个字段，并且赋值。

代码参考：

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

复制代码

2.创建数据源

创建数据源里的一个字段actionId，它的值是之前的id。

代码参考：

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

复制代码

3.DataMap创建关系

通过DataMap创建id和name的关系。

代码参考：

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

复制代码

4.设置dataMap

使用列的dataMap属性设置dataMap。

代码参考：

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

复制代码

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

免费试用
FlexGrid 包含在全能控件套包 ComponentOne Studio Enterprise 中。下载试用，请点击：
http://www.gcpowertools.com.cn/products/download.aspx?pid=2

了解更多详情，请访问官网：
http://www.gcpowertools.com.cn/products/componentone_studio_winform_flexgrid.htm

欢迎加入ComponentOne 官方QQ交流群：415971774，与数百位开发精英即时交流，还可参加每周的视频公开课，快速上手。