This is a migrated thread and some comments may be shown as answers.

Event Item Focus Problem

4 Answers 240 Views
Scheduler
This is a migrated thread and some comments may be shown as answers.
W
Top achievements
Rank 1
W asked on 23 Jul 2015, 12:19 PM

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

4 Answers, 1 is accepted

Sort by
0
Vladimir Iliev
Telerik team
answered on 27 Jul 2015, 08:31 AM
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!
 
0
W
Top achievements
Rank 1
answered on 27 Jul 2015, 01:35 PM

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)

 

 

0
W
Top achievements
Rank 1
answered on 27 Jul 2015, 01:37 PM

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

 

Here is the correct snippets:

snippet1

snippet2

0
Vladimir Iliev
Telerik team
answered on 29 Jul 2015, 08:47 AM
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!
 
Tags
Scheduler
Asked by
W
Top achievements
Rank 1
Answers by
Vladimir Iliev
Telerik team
W
Top achievements
Rank 1
Share this question
or