*Kendo UI是一个强大的框架用于快速HTML5 UI开发。基于最新的HTML5、CSS3和JavaScript标准。 Kendo UI包含了开发现代JavaScript开发所需要的所有一切，包括：强大的数据源，通用的拖拉（Drag-and-Drop）功能，模板，和UI控件。

*在线演示：

尝试过CRUD所有方法之后，我发现自动完成组件很好并且操作简单。上一篇文章中我尝试了一些不使用自动服务的方法。但是数据的操作通常是最常用的，所以我想看看JSON，JSONp或另一种可能的数据访问服务。在Kendo UI的网站上有一篇使用JSONp的教程：绑定网格到远程数据，我想试试使用网格来代替之前的自动完成服务。

JSON
使用JSON需要确认你的网络和应用程序服务是否安全和正常。否则浏览器将检测到来自不同URL页面的数据并阻止继续访问，因为数据源不同。我建议你将JSON服务建立在本机上，但是我将使用JSONp。

JSONp
JSONP是一个非官方的协议，它允许在服务器端集成Script tags返回至客户端，通过javascript callback的形式实现跨域访问（这仅仅是JSONP简单的实现形式）。你可以使用它访问流行网站的公共API，比如Twitter，Instagram和Google或其他，这是我使用它的原因。我不想在服务器上设置一个JSON数据源，这需要非常多的网络安全知识和大量的日常维护。


什么是schema:{data:"data"}？
在本教程中的数据源有一个架构属性叫数据，这是一个被分配了字符串的“数据”。它遵循惯例，但会有一些混乱，因为“数据”的意义是模糊的。因为Kendo需要确认使用JSON服务负载数据的来源，所以才这样命名。在本例使用的服务中，“数据”字符串值是由JSON服务返回的特定数据属性名称。但是Instagram可能与Twitter一样选择“response响应”来命名它，或其他名字。

为"data"查找服务名称
我提出一个问题：“如何知道包含在数据中的属性？”在教程中，笔者已经提起过与Instagram非常相似的，如何使用“数据”。我在Twitter上看到的另一篇教程详细的介绍了这个方法。由于API是公开的，服务名称都被记录下来，你可以通过阅读文档找到答案。我使用REST调用另一个服务截获的数据，可能会被强制返回JSON。通常，你访问一个JSON数据源（注册并获得API密钥），你可以运行一个查询并查看响应（在Charles，Fiddler或其他内置浏览器开发工具）以及包含在数据中的属性。

访问嵌套对象
“数据”数据的数据对象通常是嵌套的对象数组，通常都是使用网格控制的。它们可以被dot符号遍历，这样一来，网格列可以被子属性填充，例如在本教程中的“user.usemame”。Chrome提供的开发者工具非常出色，在它的预览选项卡中概述了JSON响应。我用它来显示连接对象之间的布局并将数据放入Kendo UI的网格控件。

原文链接：?p=2096

翻译词数：600