Kendo ui 添加新行后滚动虚拟化网格时，web浏览器崩溃
我正在使用KendoUIV.2013.1.514，但是在使用grid小部件时遇到了一个非常可怕的错误 如您所见，我将虚拟滚动选项设置为“true”，页面大小为25。使用addRow函数向网格添加新行后，每次向下滚动网格时，web浏览器都会崩溃。这真的很糟糕，因为我需要虚拟化，还需要向网格中添加一些新记录。我在下面粘贴了一些测试代码，希望能对大家有所帮助 顺便说一句，我在您的本地演示“virtualizationlocaldata.html”上进行了测试。似乎代码只是在DataSource小部件的“range”函数中运行循环Kendo ui 添加新行后滚动虚拟化网格时，web浏览器崩溃,kendo-ui,kendo-grid,Kendo Ui,Kendo Grid,我正在使用KendoUIV.2013.1.514，但是在使用grid小部件时遇到了一个非常可怕的错误 如您所见，我将虚拟滚动选项设置为“true”，页面大小为25。使用addRow函数向网格添加新行后，每次向下滚动网格时，web浏览器都会崩溃。这真的很糟糕，因为我需要虚拟化，还需要向网格中添加一些新记录。我在下面粘贴了一些测试代码，希望能对大家有所帮助 顺便说一句，我在您的本地演示“virtualizationlocaldata.html”上进行了测试。似乎代码只是在DataSource小部件的
<script>
$(function() {
var arrayDataSource = [];
for (var i = 0; i < 1000; i++) {
arrayDataSource.push({
check: true,
ip: "10.1.201.3"
});
}
$('#grid').kendoGrid({
height: 600,
dataSource: {
data: arrayDataSource,
schema: {
model: {
fields: {
check: { type: 'boolean' },
ip: { type: 'string' }
}
}
},
pageSize: 25
},
columns: ['check', 'ip'],
editable: false,
scrollable: {
virtual: true
}
});
$('#add').click(function() {
$('#grid').data('kendoGrid').addRow();
});
});
</script>
</head>
<body>
<div id="grid"></div>
<button id="add">add</button>
</body>
</html>
$（函数（）{
var arrayDataSource=[]；
对于（变量i=0；i<1000；i++）{
arrayDataSource.push（{
检查：正确，
ip:“10.1.201.3”
});
}
$（“#网格”）.kendoGrid({
身高：600，
数据源：{
数据：arrayDataSource，
模式：{
型号：{
字段：{
检查：{type:'boolean'}，
ip:{type:'string'}
}
}
},
页面大小：25
},
列：[“检查”、“ip”]，
可编辑：false，
可滚动：{
虚拟的：真的
}
});
$（'#添加'）。单击（函数（）{
$（“#网格”）.data（'kendoGrid'）.addRow（）；
});
});
添加
不支持在启用虚拟滚动的情况下向网格添加新元素。请记住，您可以随时在我们的反馈论坛中提交，以便在我们未来的发行版中加以考虑。运行相同的问题时，在internet上没有找到任何解决方法，因此在挖掘剑道资源后，找到了似乎有效的解决方法，但仅在完全刷新数据源的情况下 所以，下一个场景是：
- 将项添加到数据数组
- 设置
grid.dataSource.\u skip=0 - 刷新
数据源，如grid.dataSource.data（数据） - 像
$（“#grid.k-scrollbar-vertical”）一样刷新滚动条。滚动条（0）
addRow-不工作
添加顶部
添加底部
var数据=[]；
对于（变量i=0；i<100；i++）{
数据推送({
支票：i+1，
ip:'10.1.201.3'
});
}
var grid=$（“#grid”）.kendoGrid({
身高：300，
数据源：{
数据：数据，
页面大小：10，
模式：{
型号：{
id:“支票”，
知识产权：“知识产权”
}
}
},
栏目：[
{字段：“检查”}，
{字段：“ip”}
],
是的，
可滚动：{
虚拟的：真的
}
}).数据（“kendoGrid”）；
var scroller=$（“#grid.k-scrollbar-vertical”）；
$（'#添加'）。单击（函数（）{
grid.addRow（）；
});
$（“#添加顶部”）。单击（函数（）{
拼接（0,0，{check:0，ip:'1.1.1'}）；
grid.dataSource.\u skip=0；//修复数据绑定
grid.dataSource.data（数据）；
scroller.scrollTop（0）；//应该刷新scroll
});
$（“#添加底部”）。单击（函数（）{
数据推送（{检查：999，ip:'9.9.9'}）；
grid.dataSource.\u skip=0；//修复数据绑定
grid.dataSource.data（数据）；
scroller.scrollTop（scroller.prop（“scrollHeight”）；//应该刷新scroll
});
var grid = $('#grid').kendoGrid({
height: 300,
dataSource: {
data: [
{check: 1,ip: "10.1.201.3"},
{check: 2,ip: "10.1.201.3"},
{check: 3,ip: "10.1.201.3"},
{check: 4,ip: "10.1.201.3"},
{check: 5,ip: "10.1.201.3"},
{check: 6,ip: "10.1.201.3"},
{check: 7,ip: "10.1.201.3"},
{check: 8,ip: "10.1.201.3"}
],
schema: {
model: {
id: "check",
ip: "ip"
}
}
},
columns: [
{ field: "check" },
{ field: "ip" }
],
editable: true,
scrollable: {
virtual: true
}
}).data('kendoGrid');
$('#add').click(function () {
grid.addRow();
});
<button id="add">addRow - not working</button>
<button id="add-top">add top</button>
<button id="add-bottom">add bottom</button>
<div id="grid"></div>
var data = [];
for(var i = 0; i < 100; i++) {
data.push({
check: i + 1,
ip: '10.1.201.3'
});
}
var grid = $('#grid').kendoGrid({
height: 300,
dataSource: {
data: data,
pageSize: 10,
schema: {
model: {
id: "check",
ip: "ip"
}
}
},
columns: [
{ field: "check" },
{ field: "ip" }
],
editable: true,
scrollable: {
virtual: true
}
}).data('kendoGrid');
var scroller = $("#grid .k-scrollbar-vertical");
$('#add').click(function () {
grid.addRow();
});
$('#add-top').click(function () {
data.splice(0,0,{check: 0, ip: '1.1.1.1'});
grid.dataSource._skip = 0; // fix databind
grid.dataSource.data(data);
scroller.scrollTop(0); // should refresh scroll
});
$('#add-bottom').click(function () {
data.push({check: 999, ip: '9.9.9.9'});
grid.dataSource._skip = 0; // fix databind
grid.dataSource.data(data);
scroller.scrollTop(scroller.prop("scrollHeight")); // should refresh scroll
});