TimePicker TimeView Positioning

[Shaun Peet]

In the 2008 Q2 (and now in the Q3 as well) versions of the suite, I've witnessed some strange behaviour with the TimeView.

Basically I've got a form which opens in a RadWindow containing a RadDateTimePicker and a RadTimePicker on one line in the form.  The TimeView for both pickers is relatively wide and fills the entire width of the RadWindow, so for the RadTimePicker I had used style="margin-left: -300px;" to offset it back enough to be visible.  This worked until Q2.

Now, what I'm witnessing (in IE7), is a disabled scrollbar at the bottom of the TimeView for both of the pickers, which is the width of the TimeView (in this case, 520px).  The left-most part of this scrollbar always lines up with the left-side of the picker's textbox - meaning that the "margin-left: -300px;" does not affect the position of that scrollbar.  In my case, this causes a vertical scrollbar to appear in the RadWindow.  On top of that, though, the rest of the TimeView does get offset by the -300px but the part that is offset is not visible on the page.

Here's a screenshot:

http://www.microagebasics.com/support/temp/timeviewerr.png

Thanks,

Shaun.

[Dimo]

Hello Shaun,

Thanks for the screenshot.

I would suggest to focus on the TimeView scrollbar issue first. It means that the TimeView popup wrapper inherits an overflow:scroll or overflow:auto style from somewhere (there is no such style in our RadCalendar or RadWindow skins). Please try using some web developer toolbar such as Firebug to find out where this overflow style comes from. Alternatively, please send us a live URL demonstrating the problem, or attach a runnable example in a new support ticket. Thanks.

Greetings,
Dimo
the Telerik team

Check out Telerik Trainer, the state of the art learning tool for Telerik products.

[Shaun Peet]

Hi Dimo,

Thanks for the suggestion.  Please note that previous to Q2 this issue wasn't happening (and I haven't changed any of my settings either), which is why I think it may be something on your end.

I used FireBug and found the "...timeView_wrapper" element which has an inline style applied to it of "width: 520px; overflow-x: scroll;".  The only setting that I have applied in the aspx code is the width of 520px.  I have no idea where that "overflow-x: scroll;" is coming from, which is why I think it could be added somewhere in the rendering of the control - perhaps when a width is set?

I'll try to find a workaround on my end but I think you should also investigate this.  Thanks,

Shaun.

[Shaun Peet]

Just to follow-up.  I removed the Width=520px property from the TimeView and the inline overflow-x style is no longer generated.  What's also good is that the TimeView now correctly figures out how wide it needs to be (it didn't in a previous version which was why I had to manually set the width in the first place).

My Telerik Points have been updated in my world ;) 6,000,000 points have been added to my account :)

Shaun.

[Dimo]

Hello Shaun,

I have to admit that I was unaware that TimeView becomes scrollable as soon as you set width to it. Thanks :) Your Telerik points have been updated.

Kind regards,
Dimo
the Telerik team

Check out Telerik Trainer, the state of the art learning tool for Telerik products.