Kendo UI目前最新提供Kendo UI for jQuery、Kendo UI for Angular、Kendo UI Support for React和Kendo UI Support for Vue四个控件。Kendo UI for jQuery是创建现代Web应用程序的完整UI库。
Kendo UI Grid提供模板引擎和内置的DataSource，可让您快速设置和实现数据绑定功能。
入门指南
要将网格绑定到远程数据，请指定dataSource选项。您可以在小部件外部创建数据源，也可以在其中传递数据源。如果多个窗口小部件绑定到同一数据集，则必须将数据源创建为可以在不同窗口小部件中引用的对象。如果网格是绑定到数据的唯一项目，请内联创建。
$("#grid").kendoGrid({
dataSource: {
transport: {
read: "/Home/People.json"
},
schema: {
data: "data"
}
}
});
配置数据源
Kendo UI提供一个数据绑定框架，可以通过定义窗口小部件的dataSource并提供远程端点来与Grid内联使用。
下面的示例演示如何实现建议的方法。在示例中：
· dataSource创建一个新的Kendo UI DataSource并将其分配为Grid的数据源。
· transport定义您与远程数据源进行通信的方式。
· URL指向您要将小部件绑定到的数据位置。
· data列出需要发送到远程端点的其他URL参数。
· dataType指示期望数据源使用的响应格式（在示例中为JSONP）。JSONP是一种从跨浏览器请求返回JSON而不会被阻塞的方法，它将JSON响应包装在回调中，以故意误导浏览器。但是除非您完全了解其中包含的数据，否则不建议这样做。
· schema向Grid指示响应的模式是什么。
· data函数用作将要重复的JSON元素 – Kendo UI基于此元素将Grid中的每一行绑定到此元素中的项目，服务器将数据作为项目数组返回，因此重复项为"items"。
· model 描述了数据结构，通过使用它，您可以指定数据中每个字段的数据类型来进行适当处理，并在需要时显示声明唯一ID字段。
添加数据
前面的示例使用自动生成的列呈现一个Grid，并为数据项中的每个字段提供一列。要只在网格中显示所需的字段，请提供列列表，并指定必须在每个特定的列中显示服务器响应中items数组的哪个元素。
下面的示例演示如何在列数组中指定field属性，以便Grid显示响应中所需的数据。列还具有title属性，该属性为列提供了更加用户友好的标题。
处理可视化
网格不显示Image列中的图像，而是呈现JavaScript对象的字符串输出，并且日期也不以用户友好的格式显示。
下面的示例演示如何通过使用图像的嵌入式模板向Grid指示您希望小部件显示Image列的方式，通过使用列的format选项，可以正确格式化日期。
设置行模板
您可以为网格中的列显示更复杂的模板（例如，单个列中有多个字段值），同时迭代其他列的内容以生成模板输出。在这种情况下，使用rowTemplate描述单个模板中整个行的结构。
下面的示例演示如何通过对网格应用其他样式来完全自定义网格，模板中td元素的数量与Grid定义中的列数匹配。
注意：以下示例中的html代码显示特殊的脚本块，其中包含Kendo UI模板的模板语法。所使用的JavaScript也与HTML内容混合在一起，并且模板的语法类似于在PHP，Razor或其他服务器端模板引擎的创建中应用的语法。