Scrolling bug causes multiselect dropdown to close (with dojo example)

11 posts, 0 answers
  1. darryl
    darryl avatar
    13 posts
    Member since:
    May 2015

    Posted 12 May 2015 Link to this post

    http://dojo.telerik.com/IkoTO/2

    This is just a modified example from the original API Docs demo.  All I did was add a spacer div so the page has scroll.

    To reproduce: Simply click inside a multiselect, then scroll down to bottom of dropdown results.  

    You'll see the dropdown closes and then the page starts scrolling.

     

    This would be VERY annoying for any end-user.

    Telerik needs to fix this by stopPropagation of the scroll event maybe?

  2. darryl
    darryl avatar
    13 posts
    Member since:
    May 2015

    Posted 12 May 2015 in reply to darryl Link to this post

    Sorry - to be clear, it seems this bug is only reproducible on webkit browsers such as Chrome and Safari
  3. Kendo UI is VS 2017 Ready
  4. Dimo
    Admin
    Dimo avatar
    8333 posts

    Posted 14 May 2015 Link to this post

    Hi Darryl,

    Thanks for the feedback. Generally, scroll events cannot be prevented, but we'll see what are our options.

    Regards,
    Dimo
    Telerik
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
  5. darryl
    darryl avatar
    13 posts
    Member since:
    May 2015

    Posted 14 May 2015 in reply to Dimo Link to this post

    Really?  Not sure what you mean by that.  Parallax sites are a good example of exerting control over the scroll events.

     I seem to recall running into this same issue in some other site I was working on, and preventing propagation was the solution, but that is a fuzzy memory too.

  6. darryl
    darryl avatar
    13 posts
    Member since:
    May 2015

    Posted 14 May 2015 in reply to Dimo Link to this post

    Actually now that I think of it, the scroll event doesn't bubble anyway (would be crazy bad performance), so stopping propagation won't help.

    Perhaps what I did in the past project was capture the scroll event and read the current scroll status of the box - and when found at bottom or top of box, then preventDefault()

  7. darryl
    darryl avatar
    13 posts
    Member since:
    May 2015

    Posted 14 May 2015 in reply to Dimo Link to this post

    Found some ideas in this thread: http://stackoverflow.com/questions/1459676/prevent-scroll-bubbling-from-element-to-window
  8. Dimo
    Admin
    Dimo avatar
    8333 posts

    Posted 15 May 2015 Link to this post

    Hi Darryl,

    Here is a demo, which shows how to achieve the desired behavior.

    http://docs.telerik.com/kendo-ui/web/dropdownlist/how-to/prevent-close-on-scroll

    For the time being, we would like to refrain from implementing this as a built-in feature, as it is hackish and cumbersome. However, you can vote for it on our feedback portal and if there is a high-enough demand, we will consider changing our minds.

    http://feedback.kendoui.com/forums/127393-kendo-ui-feedback

    Regards,
    Dimo
    Telerik
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
  9. darryl
    darryl avatar
    13 posts
    Member since:
    May 2015

    Posted 15 May 2015 in reply to Dimo Link to this post

    I can understand not wanting to put THAT code in Kendo, not sure thats the best solution, though may be the most functional one as a hack from outside.

    Don't you think binding mousewheel to document causes way to much unnecessary load?  

    Why not bind the scroll event to the popup itself on creation of the dropdownlist or don't forget OTHER types of widgets that share the same misfortune (like multiselect and autocomplete)

     

    Sure the solution you made is hacky, and I wouldn't want to include that in Kendo either.  But there are better less hacky ways of fixing this oddity in webkit - which just happens to be a browser used by over 60% of the internet.

    Really this doesn't need VOTES - it needs a proper fix. Sure it'd be best if webkit would fix it, but we all know that is not likely.  Programming around browser flaws is part of our duty as front-end engineers.  To turn this into a hacky solution that "meh you guys can vote on adding the fix" is not the way to handle it I'd think.

     

    Bottom line:  At least 3 of your widgets suffer from a bad UX due to an oddity (bug?) in the worlds most used browser engine. 

    Do you :

    a)  drop a hacky fix into docs and ignore it?

    b)  implement a real fix into the widgets themselves that is perfectly fine performance wise

    c)  ignore it in hopes the browser engine sees fit to change the behavior

     

    hmmm

  10. Dimo
    Admin
    Dimo avatar
    8333 posts

    Posted 19 May 2015 Link to this post

    Hello Darryl,

    So far, the overall amount of feedback related to the discussed behavior does not imply high severity of the issue. Although we agree that a proper fix would be nice to have in the future, it will require some time and resources for research and testing, and we are currently focused on tasks with higher priority.

    Since this code is in the public and open-source Kendo UI Core repository, we are open to suggestions (pull requests) how to achieve the desired end result in the best possible way.

    Regards,
    Dimo
    Telerik
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
  11. andywalkers
    andywalkers avatar
    2 posts
    Member since:
    May 2014

    Posted 08 Feb in reply to Dimo Link to this post

    Hi Dimo,

    We are facing the same issue. Do you have a fix for this?

    Thanks,

    Andy

  12. Dimo
    Admin
    Dimo avatar
    8333 posts

    Posted 09 Feb Link to this post

    Hi Andy,

    We have not made changes to the MultiSelect implementation with regard to the discussed scrolling behavior, so the previously provided information and workaround still apply. 

    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
Kendo UI is VS 2017 Ready