submittting value in grid cause page scroll

3 posts, 0 answers
  1. Maksim
    Maksim avatar
    22 posts
    Member since:
    Apr 2013

    Posted 20 Feb 2016 Link to this post

    We have intergrated grid in our page but have one problem
    We have some static div and grid without inner scroll,


    <grid without scroll>
    both the header div and table are scrolled by global scroll

    The problem can be illustrated here (see attachement)

    Why global scroll changes position after entering or adding value in grid?
    Our operator edits and adds many values a day, we want global page scroll to stay in same position

    What are workarounds?

  2. Dimiter Topalov
    Dimiter Topalov avatar
    1296 posts

    Posted 25 Feb 2016 Link to this post

    Hello Maksim,

    I am sorry for the delayed response.

    The described undesired behavior is caused by the browsers' rendering engines attempt to scroll the focused element into view. In this case, after the "Enter", "Tab", or "Escape" key is pressed after editing a cell, the table element of the Grid gains focus and the page is autoscrolled.

    Unfortunately this default browser behavior cannot be overriden in the widget implementation, but I can suggest the following workarounds:

    1) Use the mouse instead of the keyboard for navigation between the cells

    2) Use JavaScript or jQuery to get the offset of the currently edited element (#grid_active_cell) and scroll the page to it on an event of your choice (keyup when the key is Enter, Tab, or Escape, blur, etc.). The concrete implementation of this option is beyond the scope of the Kendo UI Support services. If you would like further assistance with the matter, please consider Telerik Professional Services.

    I hope this helps.

    Dimiter Topalov
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
  3. Maksim
    Maksim avatar
    22 posts
    Member since:
    Apr 2013

    Posted 26 Feb 2016 Link to this post

    Thank you sir for the option 2) hint
Back to Top