Hours Column Height Sync

[Eduardo]

Hi all,

I followed this link to change the appointment's height and accommodate all appointments in the radscheduler.

http://www.telerik.com/support/kb/aspnet-ajax/scheduler/auto-expand-the-height-of-the-appointment.aspx

Since my goal is to change the week view, i changed the css to this:

.RadScheduler .rsWeekView .rsWrap,
.RadScheduler .rsWeekView .rsApt,
.RadScheduler .rsWeekView .rsAptOut,
.RadScheduler .rsWeekView .rsAptIn,
.RadScheduler .rsWeekView .rsAptMid,
.RadScheduler .rsWeekView .rsAptContent
{
        position: static !important;
        height: auto !important;
        width: 120px;
}
.RadScheduler .rsWeekView .rsWrap
{
        overflow: hidden;
        font-size: 0;
        line-height: 0;
}
.RadScheduler .rsWeekView .rsLastWrap
{
        height: 16px !important;
}
.RadScheduler .rsWeekView .rsAptContent
{
        position: relative !important;
        border-top: 0;
        border-bottom: 0;
        left: 0;
        top: 0;
}
* html .RadScheduler .rsWeekView .rsAptIn
{
        border-width: 0 1px;
        top: 0;
    margin-left: -1px;
    margin-right: -1px;
}
* html .RadScheduler .rsWeekView .rsAptMid
{
        top: 0;
        left: 1px;
        margin: 0 1px;
        border-width: 1px 0;
}

It works fine, but the hours columns height did not sync with appointment height (image attached).

Any ideas to solve this?

Thanks in advance.

[Plamen]

Hello,

 
The KB you linked is recommended only for MonthView because if used for the other views some unusual behavior may be caused by it.

Nevermind if you insist on using it in your scenario one possible solution may be to resize the lines accordingly wit javascript:

function pageLoad() {
               var $ = $telerik.$;
               var rsVerticalHeaderTableTh = $(".rsVerticalHeaderTable th");
               var rsAllDayTableTr = $(".rsContentTable tr");
               rsAllDayTableTr.each(function (index, elem) {
                   var h = $(elem).height() - 1;
                   rsVerticalHeaderTableTh[index].style.cssText = "height:" + h + "px";
               });
           }

Hope this will be helpful.All the best,
Plamen
the Telerik team