Setting styles for appointments

3 posts, 1 answers
  1. Geoff
    Geoff avatar
    53 posts
    Member since:
    Aug 2012

    Posted 15 Apr 2015 Link to this post

    I've just used the radSheduler for the first time and was impressed at how easy it was to setup from the on-line examples and demos. I am however experiencing one small problem with setting styles. I used the Telerik documentation on the subject here and everything seemed ok except that my styles are ignored but I can't figure out what I've missed.

    Here is my aspx code for the Scheduler (it uses a SQLDataSource:

    <telerik:RadScheduler ID="RadScheduler1" StartEditingInAdvancedForm="false" EnableExactTimeRendering="true"
        OnClientAppointmentEditing="AppointmentEditing" OnClientAppointmentInserting="AppointmentInserting"
        DataSourceID="ds_Logbook" DataDescriptionField="ProgComment"
        DataEndField="StopDate" DataKeyField="Logbook_Id" DataStartField="StartDate"
        DataSubjectField="ActivityDescription" SelectedView="MonthView" Height="100%" runat="server">
    </telerik:RadScheduler>

     

    Here is the DataBound event in the codebehind: 

    Protected Sub RadScheduler1_AppointmentDataBound(ByVal sender As Object, ByVal e As Telerik.Web.UI.SchedulerEventArgs) Handles RadScheduler1.AppointmentDataBound
        e.Appointment.CssClass = "rsCategory" + Replace(e.Appointment.Subject, " ", "")
    End Sub

     

    Here is the CSS:  

    .rsCategoryActivity1 {
        background-color: Blue;
        border-color: Blue;
        border-style: dotted;
        border-width: thin;
    }
     
    .rsCategoryActivity2 {
        background-color: Green;
        border-color: Green;
        border-style: dotted;
        border-width: thin;
    }
     
    .rsCategoryActivity3 {
        background-color: Yellow;
        border-color: Yellow;
        border-style: dotted;
        border-width: thin;
    }
     
    .rsCategoryActivity4 {
        background-color: Red;
        border-color: Red;
        border-style: dotted;
        border-width: thin;
    }
     
    .rsCategoryActivity5 {
        background-color: Orange;
        border-color: Orange;
        border-style: dotted;
        border-width: thin;
    }

    and here is a rendered appointment that should be shown in red but just shows up in the default skin colours:

    <div id="RadScheduler1_3_0" title="Activity 4" class="rsApt rsCategoryActivity4" style="height:21px;width:500%;">
        <div class="rsAptOut" style="height:21px;">
            <div class="rsAptMid">
                <div class="rsAptIn">
                    <div class="rsAptContent">
                        Activity 4<a class="rsAptDelete" href="#">delete</a>
                    </div>
                </div><div class="rsAptResize rsAptResizeStart" style="z-index:80;top:0px;">
                    <!-- -->
                </div><div class="rsAptResize rsAptResizeEnd" style="z-index:80;top:0px;">
                    <!-- -->
                </div>
            </div>
        </div>
    </div>

    Can anyone help?

     

     

     

     

  2. Answer
    Magdalena
    Admin
    Magdalena avatar
    421 posts

    Posted 16 Apr 2015 Link to this post

    Hello Geoff,

    Thank you for contacting Telerik support.

    The following styles will customize background and border colors of an appointment with a class rsCategoryActivity4:
    .RadScheduler .rsCategoryActivity4 .rsAptIn,
    .RadScheduler .rsCategoryActivity4 .rsAptMid,
    .RadScheduler .rsCategoryActivity4 .rsAptContent {
        background: red;
        border-color: red;
        border-style: dotted;
    }

             
    Do not hesitate to contact us if you have other questions.


    Regards,
    Magdalena
    Telerik
     

    See What's Next in App Development. Register for TelerikNEXT.

     
  3. UI for ASP.NET Ajax is Ready for VS 2017
  4. Geoff
    Geoff avatar
    53 posts
    Member since:
    Aug 2012

    Posted 17 Apr 2015 in reply to Magdalena Link to this post

    Magdalena,

    Thanks for the response. I have changed my styles as you suggested and it worked great.

    Regards

    Geoff

Back to Top