Problem: expandRow() causes jump to top of window

4 posts, 1 answers
  1. Malcolm
    Malcolm avatar
    29 posts
    Member since:
    Oct 2011

    Posted 13 Sep 2013 Link to this post

    Dear KendoUI-Team!
    I have a hierarchy grid. I want to expand a master grid row in javascript. The javascript function is called by a custom command.
    I succeeded to locate the the row.
    When I call the expandRow() method something strange happens. The Row is expanded, but the current scroll position in the browser jumps to the top of the window. It looks like the jump happens after the expansion.
    Even if I call the .click() function of the .t-plus element directly in javascript this strange behaviour occurs.

    If I perform a mouse click on the expand item in the row, the scroll position of the browser window does not change.

    Do you have any Ideas to solve this problem or find the cause?

    brgds
    Malcolm Howlett
  2. Nikolay Rusev
    Admin
    Nikolay Rusev avatar
    2289 posts

    Posted 16 Sep 2013 Link to this post

    Hello Malcolm,

    Can you provide us with example for this? We are not sure how to replicate the behavior. 

    Regards,
    Nikolay Rusev
    Telerik
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
  3. Malcolm
    Malcolm avatar
    29 posts
    Member since:
    Oct 2011

    Posted 25 Sep 2013 Link to this post

    Of course. This is quite simple.
    Just take the gridajaxhierarchyediting example from code library and exchange index.cshtml with the attached one.
    Then expand a few rows, so that the browser scroll position is not topmost.
    You will see the difference:
    - If the row is expanded using the '>' icon in the row, the scroll position is not changed after expansion
    - If you click on the "Split" Button to expand the row (you might probably rename it to 'expand') the scroll position jumps to the top.

    brgs
    Malcolm
  4. Answer
    Nikolay Rusev
    Admin
    Nikolay Rusev avatar
    2289 posts

    Posted 25 Sep 2013 Link to this post

    Hello Malcolm,

    You will need to call e.preventDefault(); inside the custom command handler in order to prevent default browser behavior when button is clicked. 

    This will prevent content scroll for your scenario.

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