No background on advanced template after upgrading to Q3

[Leif]

After switching to Q3 dlls my advanced template modal dialog has no background. Looking at it in Chrome there seems to be another style overriding the original one but since this is all coming from axd not sure how to correct it. If I switch back to Q2 dll the dialog renders as expected. Screenshots attached.

[Kamen Bundev]

Hello Leif,

In Q3 2010 we changed the visual appearance of the RadScheduler advanced form you only need to add four <div> elements in your template and a class in the main container, something like this:

<div class="rsAdvancedEdit rsAdvancedModal" style="position: relative">
    ..........
    <div class="rsModalBgTopLeft"></div>
    <div class="rsModalBgTopRight"></div>
    <div class="rsModalBgBottomLeft"></div>
    <div class="rsModalBgBottomRight"></div>
</div>

Let me know if this fixes it. We will prepare a sticky thread about this potential issue with the advanced template. Thank you for reminding us, I'm updating your Telerik points for the find.

Sincerely yours,
Kamen Bundev
the Telerik team

[Josh]

Hi Kamen,

I am experiencing the exact same problem after upgrading to Q3. I applied the fix you provided and it almost works (see the screenshot). I also noticed that the reminder popup is displaying a similar issue in IE7. This can also be seen in the Scheduler Reminder Demo.

Josh

Edit: Placing the four corner divs at the top of the main container div (instead of the bottom as in the demo) solved the issue for me. Just the (small) reminder problem now.

[Kamen Bundev]

Hello Josh,

Thank you Josh for the template problem solution, I'm updating your Telerik points for that, I would also update the sticky thread. As for the reminder - I've already fixed it, mostly with CSS. If you don't mind the drag cue to be slightly higher than the actual form, this CSS should fix the rest:

.RadScheduler .ReminderDialog
{
    padding: 0 7px;
}
div.ReminderDialog .rsRemTitleBar
{
    margin-top: 7px;
}
div.ReminderDialog .rsRemSnoozePanel
{
    bottom: 22px;
}

If you prefer pixel perfect, just get the latest internal build or wait for the next service pack.

Regards,
Kamen Bundev
the Telerik team

[Jonathan]

Hi Kamen,

this does not work in advance form.

.RadScheduler .ReminderDialog
{
    padding: 0 7px;
}
div.ReminderDialog .rsRemTitleBar
{
    margin-top: 7px;
}
div.ReminderDialog .rsRemSnoozePanel
{
    bottom: 22px;
}

this only solve partial of problem.

<div class="rsAdvancedEdit rsAdvancedModal" style="position: relative">
    ..........
    <div class="rsModalBgTopLeft"></div>
    <div class="rsModalBgTopRight"></div>
    <div class="rsModalBgBottomLeft"></div>
    <div class="rsModalBgBottomRight"></div>
</div>

anything else I can do to solve the problem.

[Kamen Bundev]

Hi Leif,

We discovered that this bug in IE7 is triggered only if those four DIV elements are at the end of the advanced form. Try moving them to the beginning, like outlined in the revised sticky thread here:
http://www.telerik.com/community/forums/aspnet-ajax/scheduler/known-issues-and-breaking-changes-radscheduler.aspx

and let me know of the result. Thank you in advance and sorry for the inconvenience.

Best wishes,
Kamen Bundev
the Telerik team