Setting appointment color without CSS?

[Rex Chappell]

Currently, I'm changing the color of different calendars using something to the effect of:

e.Appointment.CssClass = <css color>

However, I would like to set this based on an ARGB color that I'm getting through the rad ColorPicker. How would I go about doing this?

[Rex Chappell]

Does anyone have any idea how to make this happen?

[Simon]

Hello Rex Chappell,

You can set the color of Appointments in the event handler of the AppointmentCreated event of RadScheduler as shown below:

[C#]

    protected void RadScheduler1_AppointmentCreated(object sender, AppointmentCreatedEventArgs e)
    {
        WebControl rsWrap = (WebControl)e.Container.Parent.Parent.Parent.Parent.Parent;

        WebControl rsApt = (WebControl)e.Container.Parent.Parent.Parent.Parent;

        WebControl rsAptWrap = (WebControl)e.Container.Parent.Parent.Parent;

        WebControl rsAptInner = (WebControl)e.Container.Parent.Parent;
        rsAptInner.Style["background-color"] = "green";
    }

[VB.NET]

Protected Sub RadScheduler1_AppointmentCreated(ByVal sender As Object, ByVal e As AppointmentCreatedEventArgs)
    Dim rsWrap As WebControl = DirectCast(e.Container.Parent.Parent.Parent.Parent.Parent, WebControl)

    Dim rsApt As WebControl = DirectCast(e.Container.Parent.Parent.Parent.Parent, WebControl)

    Dim rsAptWrap As WebControl = DirectCast(e.Container.Parent.Parent.Parent, WebControl)

    Dim rsAptInner As WebControl = DirectCast(e.Container.Parent.Parent, WebControl)
    rsAptInner.Style("background-color") = "green"
End Sub

You need to set the appropriate style to the corresponding element of the Appointment HTML representation. In some cases, styles should be applied to different elements in order to apply correctly (due to specificity).

Kind regards,
Simon
the Telerik team

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

[Rex Chappell]

Is this possible without using a named color? As in, an arbitrary ARGB color?

[Simon]

Hello Rex Chappell,

You can set any value which is available to the color attribute.

Please use this article as a reference.

Greetings,
Simon
the Telerik team

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

[Ian Russell]

I am using Office2007 skin and with this solution only background color of the appointment description is changed and the rest of the appointment box has the default skin color.

[Simon]

Hello Attila Safari,

Some CSS styles should be applied to the correct Appointment element. In some cases, due to the specificity of CSS classes the desired style does not apply.

I suggest you test with the following AppointmentCreated event handler in order to determine which element the desired color should be applied on:

[C#]

protected void RadScheduler1_AppointmentCreated(object sender, AppointmentCreatedEventArgs e)
{
    AppointmentControl rsApt = (AppointmentControl) e.Appointment.AppointmentControls[0];

    WebControl rsAptWrap = (WebControl) rsApt.Controls[0];
    rsAptWrap.Style["background-color"] = "red";

    WebControl rsAptInner = (WebControl)rsApt.Controls[0].Controls[0];
    //rsAptInner.Style["background-color"] = "green";

    WebControl rsAptContent = (WebControl)rsApt.Controls[0].Controls[0].Controls[0];
    //rsAptContent.Style["background-color"] = "yellow";
}

[VB.NET]

Protected Sub RadScheduler1_AppointmentCreated(ByVal sender As Object, ByVal e As AppointmentCreatedEventArgs)
    Dim rsApt As AppointmentControl = DirectCast(e.Appointment.AppointmentControls(0), AppointmentControl)

    Dim rsAptWrap As WebControl = DirectCast(rsApt.Controls(0), WebControl)
    rsAptWrap.Style("background-color") = "red"

    Dim rsAptInner As WebControl = DirectCast(rsApt.Controls(0).Controls(0), WebControl)
    'rsAptInner.Style("background-color") = "green";

    Dim rsAptContent As WebControl = DirectCast(rsApt.Controls(0).Controls(0).Controls(0), WebControl)
    'rsAptContent.Style("background-color") = "yellow";
End Sub

Note: comment and uncomment each line and test to see the appearance of Appointments changing.

Sincerely yours,
Simon
the Telerik team

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

[Karl]

Hi Rex and Simon!

I've been playing around setting and changing colors programmatically. It's fun. Where do I change the CSS of the displayed text on (or in) an appointment?   I've tried 

rsAptContent.Style(

"font-color") = "red"

 

 

but that doesn't work.

Any Ideas?

Thanks
Karl

[Peter]

Hello Karl,

How about this:

  Protected Sub RadScheduler1_AppointmentCreated(ByVal sender As Object, ByVal e As Telerik.Web.UI.AppointmentCreatedEventArgs) Handles RadScheduler1.AppointmentCreated
        e.Appointment.ForeColor = Drawing.Color.Red
    End Sub

?



Peter
the Telerik team

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

[Chi]

Hi there,

I have the same problem of changing the fone color of appointments. I have tried using e.Appointment.ForeColor = Color.Black; in the AppointmentCreated event, the fone color is not changed. I have tried to set the FoneColor property of the Scheduler to Black in Design mode, it didn't help either.

It seems to me that if using a skin for a scheduler, we are not able to change the fone color of the appointments.
Are there any way to solve this problem please?

Cheers,
Chi

[Peter]

Hello Chi,

That's unusual. Can you open a support ticket and send us a simple demo of your implementation showing the problem?

Best wishes,
Peter
the Telerik team

Instantly find answers to your questions on the new Telerik Support Portal.
Check out the tips for optimizing your support resource searches.

[Oksana]

protected

 

void RadScheduler_OnAppointmentCreated(object sender, AppointmentCreatedEventArgs e)

 

 

{

 

switch (e.Appointment.Attributes["type"])

 

 

{

 

    case "1":

 

 

        e.Appointment.BackColor = System.Drawing.

Color.Beige;

 

 

 

    break;

 

 

 

    case "2":

 

 

        e.Appointment.BackColor = System.Drawing.

Color.BlanchedAlmond;

 

 

 

    break;

 

 

 

    case "3":

 

 

         e.Appointment.BackColor = System.Drawing.

Color.Goldenrod;

 

 

 

    break;

 

 

 

    default:

 

 

        e.Appointment.BackColor = System.Drawing.

Color.LightSkyBlue;

 

 

 

    break;

 

 

}

}

 

 

[Peter]

Hi Oksana,

With Q1 2009, we use background images from sprites for the appointments' background. If you want to use custom color for the appointments, you have to remove the background image with the following css rules:

 <style type="text/css">
    .RadScheduler .rsAptContent,
    .RadScheduler .rsAptIn,
    .RadScheduler .rsAptMid,
    .RadScheduler .rsAptOut
    {
        background-image: none !important;
    }
    </style>

  
and set the BackColor property from code:

  protected void RadScheduler1_AppointmentDataBound(object sender, SchedulerEventArgs e)
    {
        e.Appointment.BackColor = System.Drawing.Color.Red;
    }

If your appointments have resources associated with them, you could use the new ResourceStyleMapping feature and set up to 4 unique styles (rsCategoryBlue, rsCategoryOrange, rsCategoryRed, rsCategoryGreen) in addition to the default one. The background images for these styles are embedded in the skins so you don't have to create them. The following example demonstrates this:
http://demos.telerik.com/aspnet-ajax/scheduler/examples/resources/defaultcs.aspx

 <ResourceStyles>
                    <telerik:ResourceStyleMapping Type="User" Text="Alex" ApplyCssClass="rsCategoryBlue" />
                    <telerik:ResourceStyleMapping Type="User" Text="Bob" ApplyCssClass="rsCategoryOrange" />
                    <telerik:ResourceStyleMapping Type="User" Text="Charlie" ApplyCssClass="rsCategoryGreen" />
                </ResourceStyles>

You can also see this blog post:
http://blogs.telerik.com/tervelpeykov/posts/09-02-23/RadControls_for_ASP_NET_AJAX_receive_a_major_face-lift.aspx



Sincerely yours,
Peter
the Telerik team

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

[Dave Friedel]

e.Appointment.BackColor = <acolor>

e.Appointment.BorderStyle = BorderStyle.Solid

e.Appointment.BorderColor = Color.Black    <--- this does not work.

I have tried disabling the style like you say above BUT I cannot get the bordercolor to work.

regards,

Dave

[Peter]

Hello Dave,

We have decided to expose a property with which to set the appointment's background color without any additional css styling. Untill this happens, please use the following css fix in addition to the css already suggested above:

 div.RadScheduler .rsAptContent,
    div.RadScheduler .rsAptIn,
    div.RadScheduler .rsAptMid,
    div.RadScheduler .rsAptOut
    {
        background:none;
        margin:0;
        padding: 0;
        rightright: auto;
        bottombottom: auto;
    }
    div.RadScheduler .rsAptOut
    {
        padding-bottom: 4px;
    }
    div.RadScheduler .rsAptMid
    {
        border: 1px solid gray;
        padding-bottom: 3px;
    }
    div.RadScheduler .rsAptContent,
    div.RadScheduler .rsAptIn
    {
        padding-bottom: 3px;
    }
    div.RadScheduler .rsTimelineView .rsAptResize
    {
        margin-top: -1px;
    }

Regards,
Peter
the Telerik team

Instantly find answers to your questions on the new Telerik Support Portal.
Check out the tips for optimizing your support resource searches.

[sirishagundala]

i have seen the post which you have given but sorry i am not geeting the right answer i will say my query could you please amswer the query?
my query is i am using rad scheduler appointments  i want to apply color to the scheduler dynimically like i f i select the calender type from the dropdown its should automatically apply to the appointment that is the type i selected.......example if it is 
 

Default------ it should be blue
public calende-----r it sould be black
please answer to my query its important to me