如何使用Javascript重新加载或刷新Kendo Grid？
通常需要在某个时间之后或在用户操作之后重新加载或刷新网格。
您可以使用
$('#GridName').data('kendoGrid').dataSource.read(); <!-- first reload data source -->
$('#GridName').data('kendoGrid').refresh(); <!-- refresh current UI -->
我使用Jquery .ajax来获取数据。为了将数据重新加载到当前网格中，我需要执行以下操作：
.success (function (result){
$("#grid").data("kendoGrid").dataSource.data(result.data);
})
您可以使用以下行
$('#GridName').data('kendoGrid').dataSource.read();
$('#GridName').data('kendoGrid').refresh();
有关自动刷新功能，请查看here
通过使用以下代码，它自动调用grid的read方法并再次填充网格
$('#GridName').data('kendoGrid').dataSource.read();
重新加载网格的另一种方法是
$("#GridName").getKendoGrid().dataSource.read();
你总是可以使用$('#GridName').data('kendoGrid').dataSource.read();。在那之后你真的不需要.refresh();，.dataSource.read();会做到这一点。
现在，如果您想以更有棱角的方式刷新网格，您可以：
<div kendo-grid="vm.grid" id="grid" options="vm.gridOptions"></div>
vm.grid.dataSource.read();`
要么
vm.gridOptions.dataSource.read();
并且不要忘记将您的数据源声明为kendo.data.DataSource类型
我想刷新网格时回到第1页。只需调用read（）函数就可以使您保持当前页面，即使新结果没有那么多页面也是如此。在数据源上调用.page（1）将刷新数据源并返回到第1页，但在不可分页的网格上失败。这个函数处理两个：
function refreshGrid(selector) {
var grid = $(selector);
if (grid.length === 0)
return;
grid = grid.data('kendoGrid');
if (grid.getOptions().pageable) {
grid.dataSource.page(1);
}
else {
grid.dataSource.read();
}
}
为了完成刷新，网格将与新的读取请求一起重新呈现，您可以执行以下操作：
Grid.setOptions({
property: true/false
});
财产可以是任何财产，例如排序
你可以尝试：
$('#GridName').data('kendoGrid').dataSource.read();
$('#GridName').data('kendoGrid').refresh();
如果您希望在定时的基础上自动刷新网格，可以使用以下示例，其间隔设置为30秒：
<script type="text/javascript" language="javascript">
$(document).ready(function () {
setInterval(function () {
var grid = $("#GridName").data("kendoGrid");
grid.dataSource.read();
}, 30000);
});
</script>
只需写下面的代码
$('.k-i-refresh').click();
我从不刷新。
$('#GridName').data('kendoGrid').dataSource.read();
一直对我有用。
$("#theidofthegrid").data("kendoGrid").dataSource.data([ ]);
窗口小部件的默认/更新配置/数据设置为自动绑定到关联的数据源。
$('#GridId').data('kendoGrid').dataSource.read();
$('#GridId').data('kendoGrid').refresh();
您还可以通过向Read action发送新参数并将页面设置为您喜欢的内容来刷新网格：
var ds = $("#gridName").data("kendoGrid").dataSource;
ds.options.page = 1;
var parameters = {
id: 1
name: 'test'
}
ds.read(parameters);
在此示例中，网格的读取操作由2个参数值调用，并且在获得结果之后，网格的分页在第1页中。
最简单的刷新方法是使用refresh（）函数。这就像：
$('#gridName').data('kendoGrid').refresh();
您还可以使用以下命令刷新数据源：
$('#gridName').data('kendoGrid').dataSource.read();
后者实际上重新加载网格的数据源。两者的使用可以根据您的需要和要求进行。
$("#grd").data("kendoGrid").dataSource.read();
$('#GridName').data('kendoGrid').dataSource.read();
$('#GridName').data('kendoGrid').refresh();
在最近的一个项目中，我不得不根据一些调用来更新Kendo UI Grid，这些调用是在一些下拉选项上发生的。以下是我最终使用的内容：
$.ajax({
url: '/api/....',
data: { myIDSArray: javascriptArrayOfIDs },
traditional: true,
success: function(result) {
searchResults = result;
}
}).done(function() {
var dataSource = new kendo.data.DataSource({ data: searchResults });
var grid = $('#myKendoGrid').data("kendoGrid");
dataSource.read();
grid.setDataSource(dataSource);
});
希望这能为您节省一些时间。
如果您不想在处理程序中引用网格，则可以使用以下代码：
$(".k-pager-refresh").trigger('click');
如果有刷新按钮，这将刷新网格。可以像这样启用按钮：
[MVC GRID DECLARATION].Pageable(p=> p.Refresh(true))
实际上，他们是不同的：
$('#GridName').data('kendoGrid').dataSource.read()刷新表格行的uid属性$('#GridName').data('kendoGrid').refresh()留下同样的uid在我的情况下，我每次都有一个自定义网址;虽然结果的模式将保持不变。 我使用了以下内容：
var searchResults = null;
$.ajax({
url: http://myhost/context/resource,
dataType: "json",
success: function (result, textStatus, jqXHR) {
//massage results and store in searchResults
searchResults = massageData(result);
}
}).done(function() {
//Kendo grid stuff
var dataSource = new kendo.data.DataSource({ data: searchResults });
var grid = $('#doc-list-grid').data('kendoGrid');
dataSource.read();
grid.setDataSource(dataSource);
});
这些答案中没有一个得到read返回一个promise的事实，这意味着你可以在调用refresh之前等待数据加载。
$('#GridId').data('kendoGrid').dataSource.read().then(function() {
$('#GridId').data('kendoGrid').refresh();
});
如果您的数据抓取是即时/同步的，那么这是不必要的，但很可能它来自不会立即返回的端点。
你要做的就是在你的kendoGrid绑定代码中添加一个事件.Events（events => events.Sync（“KendoGridRefresh”））。不需要在ajax结果中写入刷新代码。
@(Html.Kendo().Grid<Models.DocumentDetail>().Name("document")
.DataSource(dataSource => dataSource
.Ajax()
.PageSize(20)
.Model(model => model.Id(m => m.Id))
.Events(events => events.Sync("KendoGridRefresh"))
)
.Columns(columns =>
{
columns.Bound(c => c.Id).Hidden();
columns.Bound(c => c.UserName).Title(@Resources.Resource.lblAddedBy);
}).Events(e => e.DataBound("onRowBound"))
.ToolBar(toolbar => toolbar.Create().Text(@Resources.Resource.lblNewDocument))
.Sortable()
.HtmlAttributes(new { style = "height:260px" })
)
并且您可以在任何.js文件中添加以下全局函数。因此，您可以为项目中的所有kendo网格调用它来刷新kendoGrid。
function KendoGridRefresh() {
var grid = $('#document').data('kendoGrid');
grid.dataSource.read();
}