Last row gets cut off when using virtual scrolling and setting the grid height after filtering

2 posts, 0 answers
  1. Derek Kepler
    Derek Kepler avatar
    2 posts
    Member since:
    Mar 2010

    Posted 13 Sep 2013 Link to this post

    Please see the attached screenshot.

    This only happens when we have both the virtual scrolling and the height set and then we filter.  It doesn't always happen, usually only after filtering on multiple columns.
    @(Html.Kendo().Grid<BulletinModel>()
                    .Name("Grid")
                    .Editable(ed => ed.Mode(GridEditMode.PopUp).Window(w => w.Width(950)))
                    .Selectable()
                    .Scrollable(scrollable => scrollable.Virtual(true))
                    .Sortable()
                    .HtmlAttributes(new { @style = "height: 600px;" }))
    Is there any way around this behavior?  Maybe setting the scrollable height on one of the containers?
  2. Dimo
    Admin
    Dimo avatar
    8443 posts

    Posted 17 Sep 2013 Link to this post

    Hi Derek,

    Virtual scrolling relies on calculations about the average row height, which is used to calculate the height of the fake vertical scrollbar. Depending on the variety and quantity of row heights, and the currently loaded data, the calculation of the average row height may not be accurate. In such cases we recommend ensuring that most rows are equally high, e.g. by defining a large-enough height for all of them. For example:


    #Grid  .k-grid-content  td
    {
          height: 100px;
    }


    Regards,
    Dimo
    Telerik
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
Back to Top