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

Fixed size of appts

2 Answers 130 Views
Scheduler
This is a migrated thread and some comments may be shown as answers.
Piyush Bhatt
Top achievements
Rank 2
Piyush Bhatt asked on 09 Jul 2008, 04:51 PM
I had earlier asked about the fixed size of appts and I was given following CSS by your support team to display appts as a fixed size.

The problem now I notice is - when there is an appt at 8 AM upto 10 AM, it hides the appt at 9 AM beneath it and does not display.

Can you please help, how to resolve this?

Thanks,
Piyush

        .RadScheduler_Outlook .rsDayView .rsRow .rsCell .rsWrap .rsApt  
        {         
            margin-right: 10px;  
            width: 200px !important;  
            left: auto !important;  
            position: relative !important;  
            float: left !important;  
        }        

2 Answers, 1 is accepted

Sort by
0
Accepted
Simon
Telerik team
answered on 11 Jul 2008, 02:43 PM
Hi Piyush,

Unfortunately fixed-size Appointments cannot be achieved only with CSS.

On the other hand, this could be achieved with server-side code only. A limitation of this approach is that the maximum width of Appointments should be defined in percentage and not in pixels.

In any case, below is the implementation of the approach for you to examine it.

Hook on the AppointmentCreated server-side event of RadScheduler and implement it as follows:

    private const int MAX_PERCENTAGE_APPOINTMENT_WIDTH = 10; 
    private bool _lastAppIsModified = false
 
    protected void RadScheduler1_AppointmentCreated(object sender, AppointmentCreatedEventArgs e) 
    { 
        double widthPercentage = e.Appointment.AppointmentControls[0].Width.Value; 
        int leftPercentage =  
            Int32.Parse(e.Appointment.AppointmentControls[0].Style["left"].Replace("%", String.Empty)); 
 
        int widthLeftRatio = (int) Math.Ceiling(leftPercentage / widthPercentage); 
 
        if (leftPercentage == 0) 
        { 
            _lastAppIsModified = false
        } 
 
        if (widthPercentage > MAX_PERCENTAGE_APPOINTMENT_WIDTH) 
        { 
            if ((leftPercentage == 0) || 
                ((leftPercentage > 0) && (_lastAppIsModified == true))) 
            { 
                Unit width = Unit.Percentage(MAX_PERCENTAGE_APPOINTMENT_WIDTH); 
 
                e.Appointment.AppointmentControls[0].Width = width; 
 
                string leftValue = (MAX_PERCENTAGE_APPOINTMENT_WIDTH * widthLeftRatio).ToString() + "%"
 
                e.Appointment.AppointmentControls[0].Style["left"] = leftValue; 
 
                _lastAppIsModified = true
            } 
        } 
    } 

The MAX_PERCENTAGE_APPOINTMENT_WIDTH variable lets you define the maximum width of Appointments in percentage.

The second variable is just a helper for the function below to catch the final Appointment in a row of Appointments with width, less than the maximum defined.

Finally, remove the CSS you were previously using to fix the width.

I hope this you will find useful.


Greetings,
Simon
the Telerik team

Instantly find answers to your questions at the new Telerik Support Center
0
Piyush Bhatt
Top achievements
Rank 2
answered on 14 Jul 2008, 03:57 PM
This is great solution man. I really appreciate this. this is going to make our release smooth.

Thanks,
pIyush
Tags
Scheduler
Asked by
Piyush Bhatt
Top achievements
Rank 2
Answers by
Simon
Telerik team
Piyush Bhatt
Top achievements
Rank 2
Share this question
or