Kendo DataSource:如何为从远程 odata 源读取的数据定义“计算”属性
Posted
技术标签:
【中文标题】Kendo DataSource:如何为从远程 odata 源读取的数据定义“计算”属性【英文标题】:Kendo DataSource: How to define "Computed" Properties for data read from remote odata source 【发布时间】:2013-02-10 18:29:39 【问题描述】:情况:
剑道数据源
var ordersDataSource = new kendo.data.DataSource(
type: "odata",
transport:
read:
url: "http://localhost/odata.svc/Orders?$expand=OrderDetails"
,
schema:
type: "json",
data: function(response)
return response.value;
total: function(response)
return response['odata.count'];
,
serverPaging: true,
serverFiltering: true,
serverSorting: true
)
从odata源读取的json数据如下:
odata.metadata: "xxxx",
odata.count: "5",
value: [
OrderId: 1,
OrderedDate: "2013-02-20",
OrderInfoA: "Info A",
OrderInfoB: "Info B"
OrderDetails: [
OrderDetailId: 6,
OrderDetailInfoC: "Info C",
OrderDetailInfoD: "Info D"
,
//Another OrderDetail's data
]
,
// Another Order's data
]
问题 1:
1.如果我想定义一个“计算”属性:OrderedDateRelative,它应该是今天(2013-02-25)和订单创建日期(2013-)之间的天数02-20),喜欢:“5天前”,我如何在客户端实现这一点?
问题1的答案:http://jsbin.com/ojomul/7/edit
问题 2--更新--
2.每个订单都有自己的嵌套属性OrderDetails,那么可以为嵌套的OrderDetails属性定义一个计算字段吗? Like:每个OrderDetail的OrderDetailInfoCAndD,其值应该类似于:OrderDetailInfoC + OrderDetailInfoD,即“Info C Info D”?
谢谢,
院长
【问题讨论】:
+1 表示问题 2,该问题仍未得到解答。 【参考方案1】:您可以通过指定数据源的模型来创建计算字段:
dataSource = new kendo.data.DataSource(
data: [
first: "John", last: "Doe" ,
first: "Jane", last: "Doe"
],
schema:
model:
// Calculated field
fullName: function()
return this.get("first") + " " + this.get("last");
);
这是一个现场演示:http://jsbin.com/ojomul/1/edit
【讨论】:
嗨,我编辑了你的演示,jsbin.com/ojomul/4/edit,CalculatedField 没有正确显示。 这是一个函数 - 你需要调用它 CalculatedField() 是的,作为函数调用它,谢谢。另一个问题是:我们可以做一些类似于 Nested Property OrderDetails 的事情吗?请参阅我更新的问题 2。 您能指定类型以便过滤器正常工作吗?比如将类型指定为布尔值、日期等。默认情况下它被视为字符串。【参考方案2】:这是在 Kendo Grid 中使用计算字段的一种方法。
var crudServiceBaseUrl = "http://demos.telerik.com/kendo-ui/service",
dataSource = new kendo.data.DataSource(
transport:
read:
url: crudServiceBaseUrl + "/Products",
dataType: "jsonp"
,
pageSize: 20,
schema:
model:
total: function (item)
return this.UnitPrice * this.UnitsInStock;
);
$("#grid").kendoGrid(
dataSource: dataSource,
pageable: true,
height: 550,
sortable: true,
filterable: true,
toolbar: ["create"],
columns: [
field: "UnitPrice", title: "Unit Price",
field: "UnitsInStock", title: "Units In Stock", width: "120px" ,
field: "total()", title: "Total" ]
);
【讨论】:
【参考方案3】:下面是一个在网格中使用它的示例。然后它还可以对列进行排序。
$("#grid").kendoGrid(
dataSource:
data: [
first: "John", last: "Doe" ,
first: "Jane", last: "Doe"
],
schema:
model:
// Calculated field
fullName: function()
return this.first + " " + this.last;
,
fields:
first: type: "string" ,
last: type: "string"
,
columns: [
// Trigger function of the Calculated field
field: "fullName()",
title: "Fullname"
,
field: "first",
title: "firstname"
]
);
【讨论】:
以上是关于Kendo DataSource:如何为从远程 odata 源读取的数据定义“计算”属性的主要内容,如果未能解决你的问题,请参考以下文章
如何为 Kendo TreeList parentID 和 hasChildren 使用自定义字段
如何为基于 JS、Kendo 和 Jquery 的网站创建原生应用程序 [关闭]