将Kendo.Grid与Backbone.Collection集成

时间:2013-02-06 11:55:38

标签: backbone.js kendo-ui

背景

我在基于客户端服务器REST的应用程序中工作,该应用程序管理各种信息并定义扩展EntitiesCollection的通用Backbone.CollectionEntitiesCollection有一个API(它扩展了Backbone.Collection API),用于CRUD操作,过滤,排序等。

我的团队需要编写一个可以显示和操作EntitiesCollection对象的Grid组件。此网格将基于某些第三方组件,我们正在认真考虑使用Kendo.Grid

The Challange

我的第一个问题是,是否有人试图使用其数据\数据源实际上是Backbone.Collection 的Kendo.Grid,以及这是否是一个好的和适用的想法?

我见过有关 Kendo Backbone 整合的各种文章,包括Derick Bailey的Backbone And Kendo UI: A Beautiful Combination。但是,这些文章讨论了视图级别集成(将Kendo.GridBackbone.View包装在一起)。我正在寻找的是数据级集成 - 使Kendo.GridBackbone.Collection一起使用。

选项

据我所知,到目前为止,Kendo.Grid适用于Kendo.DataSource,后者又拥有内部集合 - Kendo.ObservableArray

假设我们正在努力,我会看到几个实现选项:

  1. 我们讨论的其中一个选项是将EntitiesCollection转换为Kendo.DataSource但是这似乎是一个非选项 - 与服务器的通信必须通过我们自己的对象完成。

  2. Kendo.DataSource替换为EntitiesCollection - 我们的EntitiesCollection将实施Kendo.DataSource API,网格将使用它作为其dataSource对象。我不喜欢这个解决方案,因为我认为我会放弃剑道在Kendo.DataSource对象中给我的很多功能。

  3. Kendo.DataSource将包装我们自己的EntitiesCollection并将请求委托给它。

  4. Kendo.ObservableArray包含的Kendo.DataSource对象将包含我们的EntitiesCollection(请参阅我在网上找到的this示例实现)。这种方法似乎适用于简单的用例,但是我觉得有些不对劲 - 我认为Backbone.Collection不是data对象(在Kendo术语中)而是DataSource对象 - 因为它是与远程服务器交互并获取数据的那个。

2 个答案:

答案 0 :(得分:1)

所有Kendo UI小部件(包括网格)都可以将绑定到kendo.data.DataSource的实例。

我创建了'kendo-backbone'项目,以展示将Kendo UI与Backbone集成的可能方法。该项目将现有的Backbone Collection包装为Kendo ObservableArray。后者就像一个简单的代理,完全与Backbone集合一起工作。

答案 1 :(得分:1)

您可能对我刚刚发布的这篇文章感兴趣:

http://www.kendoui.com/blogs/teamblog/posts/13-02-07/wrapping_a_backbone_collection_in_a_kendo_data_datasource.aspx

在其中,我将介绍构建适配器所需的基础知识,以使用Backbone.Collection作为DataSource的后备存储,并将其连接到Kendo UI Grid。

我还没有完全解决您的所有需求 - 例如,没有寻呼支持 - 但希望这会让您走得更远。