Event Item Focus Problem

5 posts, 0 answers
  1. W
    W avatar
    17 posts
    Member since:
    Aug 2014

    Posted 23 Jul 2015 Link to this post

    Hi,

     

    I noticed recently that if I use day/week view (which will have a long scheduler container) and I click on the event after scrolling down a bit, it will automatically scroll itself up (focus) to the top position of the event item itself, in which case caused by Browser's behavior. Because of this, I can't have access for example if I want to resize the event (with 1hour slot) up to 10hours slot.

     I realized if I remove the selectable configuration, it would do fine without the focusing and scroll up problems (so the problem I described earlier won't be a problem). Then I also found out that this selectable configuration problem will cause the problem at hand only in Internet Explorer and not in Google Chrome so it won't be a problem if I use Google Chrome as a solution.

     

    However, if the div element, in which the kendo scheduler is assigned, has its css height property set, it will cause the problem to arise in both IE and Chrome. In my case, setting the selectable to "true" and set the div's height are really necessary. At the very least I can use Google Chrome to avoid the problem caused by selectable configuration. Unfortunately I still have the problem due to the height property.

     

    So, is this bug gonna be solved soon or is there a work around for this? (at least for the "height" cause)

     

    THank you

  2. Vladimir Iliev
    Admin
    Vladimir Iliev avatar
    2206 posts

    Posted 27 Jul 2015 Link to this post

    Hi,

    Please note that the described behavior is related to browser specific behavior - when given element is focused the browser trigger "scroll to view" which automatically move the element to be visible inside current view port. This behavior cannot be prevented and as possible solution I could only suggest to reduce the "height" of the widget in order to be entirely visible in current view port.

    Regards,
    Vladimir Iliev
    Telerik
     
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
     
  3. W
    W avatar
    17 posts
    Member since:
    Aug 2014

    Posted 27 Jul 2015 in reply to Vladimir Iliev Link to this post

    Hi,

     

    Thanks for replying,

    based on this snippet, The browser's behavior problem is prevented because the height field is removed in the kendoScheduler with selectable field set to true. As you can see, the widget is high enough that it is bigger than the current viewport, and when I click or select the event, the focus behavior is not triggered in Chrome and that is nice.

     

    However, when you add height field and set it to "600", the browser's behavior will be there no matter if the widget is still in the same height as before when the height field is not set.

     

    Are you sure there is no work around for this?

     

    For comparison, here is the slight 2 different snippets:

    snippet1 - the same snippet, no height is set and the problem does not occur (use chrome)

    snippet2 - height is set to 600 and the problem occurs (use chrome)

     

     

  4. W
    W avatar
    17 posts
    Member since:
    Aug 2014

    Posted 27 Jul 2015 in reply to W Link to this post

    Sorry, the links I provided in my previous post went wrong,

     

    Here is the correct snippets:

    snippet1

    snippet2

  5. Vladimir Iliev
    Admin
    Vladimir Iliev avatar
    2206 posts

    Posted 29 Jul 2015 Link to this post

    Hello,

    The scroll to view browser behavior can be reproduced in all of the provided examples if smaller viewport is used. As you can't guarantee that all users will use full HD+ resolution I would suggest to either detect current user view port and adjust the Scheduler height in order to not exceed it or disable the "selectable" option of the Scheduler (as it's requires focusing the widget element which cause the automatic browser scroll). 
    Also please note that this browser behavior can be reproduced using regular Html elements that are focused and cannot be prevented. 

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