我想使用KoGrid lib,但我遇到了无法解决的问题。 如果我有新的数据显示,我不知道如何刷新网格。 我需要在ajax调用后更新数据。
$.ajax({
type: "GET",
url: reqvesturl,
cache: false,
dataType: "jsonp",
success: function (data) {
resultData = data;
if (!model)
{
model =new mainViewModel();
ko.applyBindings(model);
}
else
{
model.myData(data);
//mo.applyBindings();
};
//model.myData(data);
},
error: function (jqXHR, textStatus, errorThrown) {
}
});
var resultData = new Array();
var model ;
function mainViewModel() {
var self = this;
var checkmarkFilter = function (input) {
return input ? '\u2714' : '\u2718';
};
var dateFilter = function (input) {
return new Date(input);
};
self.mySelections = ko.observableArray([]);
self.myData = ko.observableArray([]);
self.myVisibleData = ko.observableArray([]);
self.filterOptions = {
filterText: ko.observable(""),
useExternalFilter: false
};
self.pagingOptions = {
pageSizes: ko.observable([10, 20, 50]), //page Sizes
pageSize: ko.observable(10), //Size of Paging data
totalServerItems: ko.observable(0), //how many items are on the server (for paging)
currentPage: ko.observable(1) //what page they are currently on
};
self.getPagedDataAsync = function (pageSize, page, searchText) {
var pagedData = resultData.slice((page - 1) * pageSize, page * pageSize);
self.myVisibleData(pagedData);
self.myData(resultData);
self.pagingOptions.totalServerItems(resultData.length);
// setTimeout(function () {
// var data;
// if (searchText) {
// var ft = searchText.toLowerCase();
// data = largeLoad().filter(function (item) {
// return JSON.stringify(item).toLowerCase().indexOf(ft) != -1;
// });
// } else {
// data = largeLoad();
// }
// //var pagedData = data.slice((page - 1) * pageSize, page * pageSize);
// self.myData(data);
// self.pagingOptions.totalServerItems(data.length);
// }, 100);
};
self.pagingOptions.pageSize.subscribe(function (a) {
self.getPagedDataAsync(a, self.pagingOptions.currentPage(), self.filterOptions.filterText());
});
self.pagingOptions.currentPage.subscribe(function (a) {
self.getPagedDataAsync(self.pagingOptions.pageSize(), a, self.filterOptions.filterText());
});
self.filterOptions.filterText.subscribe(function (a) {
self.getPagedDataAsync(self.pagingOptions.pageSize(), self.pagingOptions.currentPage(), a);
});
self.getPagedDataAsync(self.pagingOptions.pageSize(), self.pagingOptions.currentPage());
self.columnsChanged = function(newCols) {
return true;
};
self.gridOptions = {
data: self.myVisibleData,
selectedItems: self.mySelections,
displaySelectionCheckbox: true,
multiSelect: true,
showGroupPanel: false,
showColumnMenu: false,
showFilter: false,
columnsChanged: self.columnsChanged,
maintainColumnRatios: true,
enablePaging: true,
pagingOptions: self.pagingOptions,
columnDefs: ko.observableArray( [{ field: 'name', displayName: 'Adr', width: 'auto' },
{ field: 'type', displayName: 'type', width: 'auto' },
{ field: 'id', displayName: 'id', width: 'auto' } ])
};
}
//ko.applyBindings(new mainViewModel());
如何刷新网格?
答案 0 :(得分:1)
如果ajax方法返回成功,请在mainViewModel中调用一个名为refresh的方法,如下所示:
self.refresh = function(myAjaxData){ self.myData(myAjaxData) }