Scrollbar is missing after filtering the grid

4 posts, 0 answers
  1. Natalia
    Natalia avatar
    6 posts
    Member since:
    Dec 2012

    Posted 07 Mar 2013 Link to this post

    Hi,

    The horizontal scrollbar in the grid goes missing when I filter a column which is not shown initially. Once the scrollbar is not shown anymore, there is no way for me to reset the filter.

    Has this issue been raised by someone? When are you planning to fix this? Thanks.
  2.
  3. Natalia
    Natalia avatar
    6 posts
    Member since:
    Dec 2012

    Posted 08 Mar 2013 Link to this post

    May I please have an answer to this? Thanks.

    Natalia
  5. Dimiter Madjarov
    Admin
    Dimiter Madjarov avatar
    2284 posts

    Posted 11 Mar 2013 Link to this post

    Hello Natalia,

    I tried to reproduce the issue, that you are referring to, but to no avail. Could you send us a sample project with the exact scenario, so I could test it locally and assist you further?

     

    All the best,
    Dimiter Madjarov
    the Telerik team
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
  7. Dimiter Madjarov
    Admin
    Dimiter Madjarov avatar
    2284 posts

    Posted 11 Mar 2013 Link to this post

    Hi Natalia,

    After further testing I managed to reproduce the mentioned behavior. It is happening, because the browsers show a scroll-bar for the table only when there is at least a single row in it. And since the filter returns an empty collection in the current scenario, the scroll-bar disappears. As a solution, you could bind to the dataBound event of the Grid and add an empty row if the current page does not contain any items.
    E.g.
    function onDataBound(e) {
        if (e.sender.dataSource.view().length == 0) {
            var colspan = e.sender.thead.find("th").length;
            //insert empty row with colspan equal to the table header th count
            var emptyRow = "<tr><td colspan='" + colspan + "'></td></tr>";
            e.sender.tbody.html(emptyRow);
            e.sender.table.width(800);
        }
    }

     

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