To run our tests, we did create a table with 1 000 000 records. After displaying 553 385 records, the grid starts to struggles... only half of the row #553 386 is displayed, and then we can't scroll any further in the list.
Did someone else noticed bugs with the grid when displaying more than 500 000 rows?
16 Answers, 1 is accepted
The Kendo grid is not capable of displaying that many table rows unless virtualization is enabled. Here is a demo showing how to do that: http://demos.kendoui.com/web/grid/virtualization-remote-data.html
Regards,Atanas Korchev
the Telerik team
Rank 1
We have successful customer implementations with close to a million records. Here is one of them: http://wakanda.spirit.de:8081/ Does that work for you? How is your grid configured by the way?
Atanas Korchev
the Telerik team
Rank 1
Are you sure the example you gave me is working properly???
If you sort you grid by last name, "Obrien" is the last name in the list but there's many missing records (every last name from "Obrien" to "Zuniga".
EDIT
The problem is only with IE9... Firefox and Chrome are ok
IE9 has maximum limit for the total height of a DOM element. It is likely that this limit has been hit which prevents the virtual scrolling from working. Other browsers also have a limit but the number is just bigger.
Anyway I couldn't reproduce this problem in IE9 (see this video ). I suggest you send us a runnable sample project which shows the problem you are experiencing.
Atanas Korchev
the Telerik team
Rank 1
I just looked at your video... you only scrolled a few lines in the grid (From Z to Y). Try to scroll all the way down and you'll see the bug.
Simon
Rank 1
I can confirm that this is an issue in IE8/9. Interestingly enough it's working in IE7.
I've updated the example at http://wakanda.spirit.de:8081/ with the information about an IE8/IE9 issue and linked it back to this thread.
Frohes Schaffen
Rainer
We have looked into the problem however, it seems that IE9 limits the maximum scroll height of scrollable elements. Unfortunately, this will yield incorrect scrollbar height, which will not allow all of grid items to be visible. Here is very basic sample which demonstrates the issue:
Regards,
Rosen
the Telerik team
Rank 1
In another demo that I'm working on we're hit by an Firefox issue after command columns have been added, which is probably related to the way virtual scrolling is implemented (http://openaccess.spirit.de/?ReadWrite=1). Looks like adding a couple of pixels per line (itemheight) with a dataSource.total() of 1 million violates the limit in firefox as well.
In Kendo.grid.js line 216 totalheight is calculated as follows.
totalHeight = dataSource.total() * itemHeight + addScrollBarHeight; for (idx = 0; idx < math.floor(totalHeight / maxHeight); idx++) { html += '<div style="width:1px;height:' + maxHeight + 'px"></div>'; }Probably worth to look into the scrolling algorythm and enhance it to support larger datasets. Something along the line of figuring out the max supported total height per browser and use that to slice the totalHeight into managable junks.
Frohes Schaffen
Rainer
I suspect that your case have hit the FireFox's limit for the total height of a DOM element. You may consider either constraining the number of total loaded items in the grid or making rows smaller, for example by decreasing the font size.
Regards,Rosen
the Telerik team
Rank 1
Maybe the demos with 1 million items are simply beyond what can be done with virtual scrolling today. @Simon did some measurements and according to his findings he hit a limit at #553 386 items. Would that be KendoUI's recommendation to not work with larger sets than that?
While 553 386 is still an impressive number one million simply sounds better ;-), but on a more serious note I'd expect that eventually with virtual scrolling there should be no limit at all.
As to the second issue with command columns and Firefox, I agree with you that this has probably nothing to do with reaching Firefox's DOM height limit, so I'll do some more testing and come back in a separate thread.
Rainer
The item count will depend on the height of the elements, therefore it will vary at case by case bases.
Greetings,Rosen
the Telerik team
Rank 1
I agree with you that there is an upper limit of items that can be handled in the grid, where the limit itself is based on various factors like row height, browser version etc.
As said before I think that the virtualisation algorithm shouldn't introduce such a limitation I will therefore go ahead and file a support request.
Thanks,
Rainer
Rank 1
Rank 1
nothing is coming ??
@(Html.Kendo().Grid<MvcApplication1.Models.ItemMaster>()
.Name("Grid")
.Columns(columns => {
columns.Bound(p => p.Item_Code );
columns.Bound(p => p.Item_Name ).Width(140);
columns.Command(command => command.Destroy()).Width(110);
})
.ToolBar(toolbar => {
toolbar.Create();
toolbar.Save();
})
.Editable(editable => editable.Mode(GridEditMode.InCell))
.Pageable()
.Sortable()
.Scrollable()
.DataSource(dataSource => dataSource
.Ajax()
.Batch(true)
.ServerOperation(false)
.Events(events => events.Error("error_handler"))
.Model(model => model.Id(p => p.Item_Code ))
.Create("Editing_Create", "item")
.Read("Editing_Read", "item")
.Update("Editing_Update", "item")
.Destroy("Editing_Destroy", "item")
)
)
<script type="text/javascript">
function error_handler(e) {
if (e.errors) {
var message = "Errors:\n";
$.each(e.errors, function (key, value) {
if ('errors' in value) {
$.each(value.errors, function () {
message += this + "\n";
});
}
});
alert(message);
}
}
</script>
I'm afraid that I'm not sure how your question or scenario is related to this thread initial topic. Therefore, please open a separate one. Meanwhile, you should check the troubleshooting section in our documentation here.
All the best,Rosen
the Telerik team