因此,我以Kendo提供的示例使用外部数据源,出于某种原因,当您放置Default.aspx的URL(其中GetEvents是Default.aspx中的一个Web方法)时,它会返回Default.aspx的整个HTML,而不是仅在普通AJAX调用中调用Web方法。
因此,我找到了解决这个问题的方法,并使用本地数据源方法,它调用一个javascript函数-这个javascript函数对default.aspx中的webmethod进行自己的ajax调用,并获得成功的响应
这是我的代码
$(document).ready(function () {
$("#grid").kendoGrid({
dataSource: {
data: createRandomData(),
schema: {
data: "d"
},
pageSize: 10
},
height: 250,
scrollable: true,
sortable: true,
filterable: true,
pageable: {
input: true,
numeric: false
},
columns: [
{
field: "Title",
title: "Title",
width: 100
},
{
field: "StartDate",
title: "StartDate",
width: 100
},
{
field: "Keywords",
width: 100
}
]
});
});
以下是createRandomData()返回的内容的开始-它是有效的json-我只是不想把它全部粘贴起来,让这个问题变得不可读
"d" : [
{
"Title": "Chicago BlackHawks vs. Detroit Redwings",
"StartDate": "9/7/2012 12:00:00 AM",
"Keywords": "-- Select --"
},
{
"Title": "",
"StartDate": "1/1/1900 12:00:00 AM",
"Keywords": "-- Select --"
}, .......
我看不出为什么这不起作用,现在网格只是说"加载…",并永远保持这样,没有控制台错误
function createRandomData() {
$.ajax({
type: "POST",
url: "MyEvents.aspx/GetEvents",
contentType: "application/json; charset=utf-8",
dataType: "json",
success: function (msg) {
var rs = msg;
return rs;
}
});
return false;
}
可能的问题是KendoUI在使用data
元素时需要一个简单的javascript调用(没有AJAX)。当您调用JS方法时,它会立即返回,但AJAX调用需要更长的时间才能完成,但Kendo网格在调用完成时从未收到通知。
您可以尝试在dataSource上使用transport.read
对象。通过这种方式,网格应该可以很好地使用AJAX调用。
编辑:你试过这样的东西吗:
dataSource: {
transport: {
read: function(options) {
$.ajax({
type: "POST",
url: "MyEvents.aspx/GetEvents",
contentType: "application/json; charset=utf-8",
dataType: "json",
success: function (msg) {
options.success(msg.d);
}
});
}
}
}
也许可以更改您的模式定义:
从这个
schema: {
data: "d"
}
到这个
schema: {
model: {
fields: {
Title: { type: "string" },
StartDate: { type: "string" },
Keywords: { type: "string" }
}
}
}