Jquery Jtable 从 ajax 调用加载 Json
Jquery Jtable load Json from ajax call
我正在使用 jtable.org-s
库来显示 table 中的行。为了填充行,我使用了 listAction
这样的:
actions: {
listAction: '/Passengers/Search'
},
此 URL 返回有效 json 并且一切正常。但我想从 ajax 手动调用 URL,因为这 URL returns 的信息比行多。它还 returns 我需要的其他表单元素的信息,例如搜索结果项数、woman/man 比率等
所以,我想 ajax 调用,并将响应加载到我的 jtable
:
$.ajax({
url: '/Passengers/Search',
type: 'POST',
data: {},
success: function(data) {
// here I would like to inject the Json(data) to my table
}
});
您可以使用 FunctionsAsActions feature of jquery-jtable.
在 ajax 成功过滤器中,您可以过滤您的响应数据,使用 $dfd.resolve(data);
您可以将过滤后的数据加载到 jquery-jtable.
例如:
listAction: function (postData, jtParams) {
console.log("Loading from custom function...");
return $.Deferred(function ($dfd) {
$.ajax({
url: '/Demo/StudentList?jtStartIndex=' + jtParams.jtStartIndex + '&jtPageSize=' + jtParams.jtPageSize + '&jtSorting=' + jtParams.jtSorting,
type: 'POST',
dataType: 'json',
data: postData,
success: function (data) {
//filter your data here and then pass filtered data to $dfd.resolve function
$dfd.resolve(data);
},
error: function () {
$dfd.reject();
}
});
});
},
abpatil 推荐的答案很好
一个更简单的解决方案可能是使用 jTable recordsLoaded
事件 http://jtable.org/ApiReference/Events#event-recordsLoaded
处理程序被赋予一个具有两个组件的事件数据对象。 data.records
是服务器发送的所有记录的数组,data.serverResponse
是来自服务器的完整 json 响应。
您可以遍历记录并处理任何额外的字段。
服务器还可以发送 jTable 未使用的额外 json 属性,您可以在此处处理 data.serverResponse
并在其他页面元素中使用它们。
我正在使用 jtable.org-s
库来显示 table 中的行。为了填充行,我使用了 listAction
这样的:
actions: {
listAction: '/Passengers/Search'
},
此 URL 返回有效 json 并且一切正常。但我想从 ajax 手动调用 URL,因为这 URL returns 的信息比行多。它还 returns 我需要的其他表单元素的信息,例如搜索结果项数、woman/man 比率等
所以,我想 ajax 调用,并将响应加载到我的 jtable
:
$.ajax({
url: '/Passengers/Search',
type: 'POST',
data: {},
success: function(data) {
// here I would like to inject the Json(data) to my table
}
});
您可以使用 FunctionsAsActions feature of jquery-jtable.
在 ajax 成功过滤器中,您可以过滤您的响应数据,使用 $dfd.resolve(data);
您可以将过滤后的数据加载到 jquery-jtable.
例如:
listAction: function (postData, jtParams) {
console.log("Loading from custom function...");
return $.Deferred(function ($dfd) {
$.ajax({
url: '/Demo/StudentList?jtStartIndex=' + jtParams.jtStartIndex + '&jtPageSize=' + jtParams.jtPageSize + '&jtSorting=' + jtParams.jtSorting,
type: 'POST',
dataType: 'json',
data: postData,
success: function (data) {
//filter your data here and then pass filtered data to $dfd.resolve function
$dfd.resolve(data);
},
error: function () {
$dfd.reject();
}
});
});
},
abpatil 推荐的答案很好
一个更简单的解决方案可能是使用 jTable recordsLoaded
事件 http://jtable.org/ApiReference/Events#event-recordsLoaded
处理程序被赋予一个具有两个组件的事件数据对象。 data.records
是服务器发送的所有记录的数组,data.serverResponse
是来自服务器的完整 json 响应。
您可以遍历记录并处理任何额外的字段。
服务器还可以发送 jTable 未使用的额外 json 属性,您可以在此处处理 data.serverResponse
并在其他页面元素中使用它们。