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

Changing timeslot background color programmatically breaks hover background color

3 Answers 200 Views
Scheduler
This is a migrated thread and some comments may be shown as answers.
Prava kafle
Top achievements
Rank 1
Prava kafle asked on 04 Jan 2013, 06:07 PM
Hi,
I am setting background color of RadScheduler's time slot based on some data source attribute.

protected void Schedule_TimeSlotCreated(object sender, TimeSlotCreatedEventArgs e)
    {
              ................
               If(condition == 1)
                       e.TimeSlot.Control.BackColor = Color.White;
               else
                        e.TimeSlot.Control.BackColor = Color.Grey;
                ....
}

On doing so, it is breaking hover background color (especially height). now, when I hover over a timeslot, it partially highlights  it as seen in the image attached. How can I give a background color to time slot and also  highlight  100% width and hieght of timeslot  on hover?

Thanks,
Prava

3 Answers, 1 is accepted

Sort by
0
Plamen
Telerik team
answered on 07 Jan 2013, 01:18 PM
Hello Prava,

 
You can achieve this functionality by using the following code:

protected void RadScheduler1_TimeSlotCreated(object sender, TimeSlotCreatedEventArgs e)
   {
       RadScheduler scheduler = (RadScheduler)sender;
   
       if (scheduler.SelectedView == SchedulerViewType.TimelineView)
       {
 
           e.TimeSlot.CssClass = "White";
       }
 
   }
<style type="text/css">
        .White{
        background-color:white !important;
         
        }
        .White:hover{
        background-color: #C5C5C5 !important;
        }
 
    </style>

Hope this will be helpful.

Greetings,
Plamen
the Telerik team
If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the RadControls for ASP.NET AJAX, subscribe to their blog feed now.
0
Prava kafle
Top achievements
Rank 1
answered on 07 Jan 2013, 02:29 PM
Hi Plamen,

I cannot assign css classes to radItems dynamically, If  I do so I will have to add  15 - 20  css classes and their hovered states.  
By modifying your code little bit(removing background image) I was able to completely  highlight selected row and hovered row .



 .White{

        background-color:white !important;

         

        }

        .White:hover{

        background-color: #C5C5C5 !important;
        background-image:none !important;

        }




If possible, I would like to keep the background image  that comes with skin and make it cover 100% row height. 
Above code removes it.

Thanks,
Prava








Thanks,
Prava
0
Ivan Zhekov
Telerik team
answered on 11 Jan 2013, 09:14 AM
Hello, Prava.

Setting the background colour from code behind will not yield the desired effect, since inline styles are more important than external styles. Thus, you had that nasty effect.

Using styles with !important flag will yield similar result.

This is why a simple selector is needed e.g.:

.RadScheduler_Default .White {
    background-color: white;
}

Of course, if you are not using the default skin, you will need to change the name to match accordingly.

Regards,
Ivan Zhekov
the Telerik team
If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the RadControls for ASP.NET AJAX, subscribe to their blog feed now.
Tags
Scheduler
Asked by
Prava kafle
Top achievements
Rank 1
Answers by
Plamen
Telerik team
Prava kafle
Top achievements
Rank 1
Ivan Zhekov
Telerik team
Share this question
or