Wijmo5 Flexgrid基础教程:增加和删除

bigegpt 2024-12-02 15:23 6 浏览

Wijmo Enterprise下载>

对于表格控件，很基本的操作就是增加和删除，在WinForm平台下我们能够很轻易地实现。那么基于HTML5，我们又要怎么去实现这个功能呢？本文就介绍flexgrid的基本操作：增加删除。

在学习增加和删除之前，我们需要了解wijmo5的另一个重要的概念：CollectionView。它由ICollectionView接口继承而来，用标准的JavaScript数组提供数据。由于CollectionView类继承自以下三个接口：

ICollectionView
IEditableCollectionView
IPagedCollectionView

因此就能够容易的获取当前的数据，排序、过滤、分组、添加删除以及分页。有了这个基础，我们就来介绍利用它继承的IEditableCollectionView接口来实现增加和删除。

增加

1.addNew

通过CollectionView的addNew方法，可以添加一个新的item到集合。这个方法没有参数，在添加新的数据后，还需要使用commitNew和cancelNew的方法进行数据的提交或是取消。典型的使用方法：

// create the new item, add it to the collection
var newItem = view.addNew;
// initialize the new item
newItem.id = getFreshId;
newItem.country= 'Chinese';
// commit the new item so the view can be refreshed
view.commitNew;

2.CollectionView.Items.push

通过CollectionView.Items拿到当前的数据，并且通过push添加一个新的数据。代码参考：

var cv = grid.itemsSource;
var data = cv.items;

data.push({
id: cv.items.length,
country: countries[i % countries.length]
});
cv.refresh;

删除

CollectionView提供了remove和removeAt方法，可以根据项目删除指定的项目，也可以根据项目的索引删除项目。使用CollectionView.currentItem就可以得到当前选择的项目，因此删除选择项目的代码参考：

var cv = grid.itemsSource;

cv.remove.remove(cv.currentItem);
cv.refresh;

根据本文的介绍，就能很容易的对flexgrid进行增加和删除。

PS: 关于ComponentOne，这些产品你可以关注>>

葡萄城经典UI产品新年大促，惊喜折扣礼品送不停！

本站文章除注明转载外，均为本站原创或翻译

c#的devexpress控件gridcontrol实现分页

上一篇：CUDA C/C++ 流和并发
下一篇：XtraReport控件VS微软RDLC报表，谁更胜一筹?

Wijmo5 Flexgrid基础教程:增加和删除

增加

1.addNew

2.CollectionView.Items.push

删除

PS: 关于ComponentOne，这些产品你可以关注>>

葡萄城经典UI产品新年大促，惊喜折扣礼品送不停！

相关推荐

idea本地配置连接远程hadoop集群的一些网络问题解决汇总

无缓存不行?例行升级的入门级阿斯加特AN2 SSD装机点评

Ceph运维手册(基于P版本)

大数据开发前要做什么准备?8台Hadoop服务器进行集群规划前配置

Tensorflow分类loss函数总结 tensorflow绘制loss曲线

R语言学习笔记(七) -离散型数据的模型预测2

iOS Runtime详解

7 个对 Java 意义重大的性能指标，你知道几个?

PHP 远程调试最佳实践

Laravel框架使用图片处理简单教程