我真的很难使用Controller服务加载jsGrid。我无法正确地做到这一点。
我甚至尝试过jsGrid网站演示中的示例代码,但是它也没有工作,它会在!this.data.length处抛出错误,或者网格根本不加载。
每次尝试使用下面的代码时都没有数据。
感谢是否有人可以提供帮助。
这是加载jsGrid的方式:
$(element).jsGrid({
height: 300,
width: "100%",
filtering: true,
sorting: true,
paging: true,
autoload: true,
pageLoading: true,
controller: {
loadData: function (filter) {
$.ajax({
type: "GET",
url: "../Common/GetData",
data: filter,
dataType: "JSON"
});
}
},
pageSize: 10,
pageButtonCount: 5,
pageIndex: 1,
noDataContent: "No Record Found",
loadIndication: true,
loadIndicationDelay: 500,
loadMessage: "Please, wait...",
loadShading: true,
fields: [
{ name: "Name", type: "textarea", width: 150 },
{ name: "Age", type: "number", width: 50 },
{ name: "Address", type: "text", width: 200 },
{ name: "Country", type: "select" },
{
name: "", type: "text", width: 50, sorting: false, filtering: false,
itemTemplate: function (value) {
return '<div class="edit-container"><a class="edit-custom-field-link">Edit</a><div class="sort-icon-container"><div class="up-arrow-icon"></div><div class="down-arrow-icon"></div></div></div>';
}
}
//{ name: "Married", type: "checkbox", title: "Is Married", sorting: false }
//,{ type: "control" }
]
});
答案 0 :(得分:6)
您应该在加载数据时使用promise,
loadData: function(filter) {
return $.ajax({
type: "GET",
url: "../Common/GetData",
data: filter,
dataType: "JSON"
})
}
return $.ajax({})
返回承诺。是的,谢谢!
答案 1 :(得分:5)
我也遇到了JSGrid的问题。我正在使用以下代码段(正如一些人所建议的那样):
`
loadData: function(filter) {
console.log("LoadData called....")
var d = $.Deferred();
$.ajax({
type: "GET",
url: "/secure/msgitems",
data: filter
}).done(function(response) {
console.log( response);
d.resolve(response);
return;
});
return d.promise();
},
},
`
我可以看到结果回来,但我的jsGrid一直在呕吐。事实证明,服务器必须以下列格式返回数据:
{
data: [items],
itemsCount: amountOfItems
}
以下是开发人员讨论此主题的位置:https://github.com/tabalinas/jsgrid/issues/35
似乎有效... FWIW
答案 2 :(得分:0)
要返回承诺,请尝试使用loadData的代码:
loadData: function() {
var d = $.Deferred();
$.ajax({
type: 'GET',
url: '../Common/GetData',
dataType: "json",
success: function (data) {
d.resolve(data);
},
error: function(e) {
alert("error: " + e.responseText);
}
});
return d.promise();
}