Kendo UI使用教程：Kendo UI Grid中的动态数据（二）

通过70多个可自定义的UI组件，Kendo UI Professional可以创建数据丰富的桌面、平板和移动Web应用程序。本教程将为大家介绍如何逐步创建具有动态数据的Kendo UI grids。

Kendo UI首推团队升级培训套包，享超低折扣！查看详情>>>

【Kendo UI R3 2017最新版下载】

该功能可以扩展为包括其他模式模型设置，如验证和默认值。或者您可以收集日期类型的字段名称，以便稍后在列设置中进行格式化。

var dateFields = [];function generateModel(sampleDataItem) {var model = {};var fields = {};for (var property in sampleDataItem) {if (property.indexOf("ID") !== -1) {model["id"] = property;}var propType = typeof sampleDataItem[property];if (propType === "number") {fields[property] = {type: "number"};if(model.id === property){fields[property].editable = false;}} else if (propType === "boolean") {fields[property] = {type: "boolean"};} else if (propType === "string") {var parsedDate = kendo.parseDate(sampleDataItem[property]);if (parsedDate) {fields[property] = {type: "date"};dateFields[property] = true;}}}model.fields = fields;return model;}

4. 现在我们有了模式模型，可以创建Kendo UI数据源。该函数应该接收基本URL和模型作为参数。 由于服务遵循命名约定，因此可以使用CRUD操作轻松创建此动态数据源：

function generateDataSource(baseURL, model) {var dataSource = {transport: {read: {url: baseURL},create:{url: baseURL + "Create"},update:{url: baseURL + "Update"},destroy:{url: baseURL + "Destroy"},parameterMap: function(options, operation) {if (operation !== "read" && options.models) {return {models: kendo.stringify(options.models)};}}},batch:true,schema: {model:model},pageSize: 10};return dataSource;}

购买正版授权的朋友可以点击”咨询在线客服”哦~~~