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

multiple condition on one column using cellstyleselector

2 Answers 354 Views
GridView
This is a migrated thread and some comments may be shown as answers.
Serkan
Top achievements
Rank 1
Serkan asked on 27 Jun 2012, 03:14 PM
Hi i have a grid and have multiple columns. i used cellstyleselector for a column as in code below. 
but i want to add a condition to startDate and endDate column:

if (startDate<=DateTime.Now && DateTime.Now<=endDate) 
background color of both startdate and enddate columns will be green , else red 

how can i add this 2 condition these columns? 
or any idea with different approach? help needed.. 



<telerik:RadGridView Name="ScheduleMaster" >
<telerik:RadGridView.Columns>
    <telerik:GridViewDataColumn Header="scheduleID" DataMemberBinding="{Binding scheduleID}" />
    <telerik:GridViewDataColumn Header="scheduleName" DataMemberBinding="{Binding scheduleName}" />
    <telerik:GridViewDataColumn Header="startDate" DataMemberBinding="{Binding startDate}" >
         
    </telerik:GridViewDataColumn>
    <telerik:GridViewDataColumn Header="endDate" DataMemberBinding="{Binding endDate}" />
    <telerik:GridViewDataColumn Header="startTime" DataMemberBinding="{Binding startTime}" />
    <telerik:GridViewDataColumn Header="endTime" DataMemberBinding="{Binding endTime}" />
    <telerik:GridViewDataColumn Header="isActive" DataMemberBinding="{Binding isActive}" >
        <telerik:GridViewDataColumn.CellStyleSelector>
            <telerik:ConditionalStyleSelector>
                <telerik:StyleRule Condition="isActive =false">
                    <Style TargetType="telerik:GridViewCell">
                        <Setter Property="Background" Value="Red"/>
                        <Setter Property="Foreground" Value="White"/>
                    </Style>
                </telerik:StyleRule>
                <telerik:StyleRule Condition="isActive =true">
                    <Style TargetType="telerik:GridViewCell">
                        <Setter Property="Background" Value="Green"/>
                        <Setter Property="Foreground" Value="White"/>
                    </Style>
                </telerik:StyleRule>
 
            </telerik:ConditionalStyleSelector>
        </telerik:GridViewDataColumn.CellStyleSelector>
    </telerik:GridViewDataColumn>
    <telerik:GridViewDataColumn Header="orderID" DataMemberBinding="{Binding orderID}" />
    <telerik:GridViewDataColumn Header="lastUpdateDate" DataMemberBinding="{Binding lastUpdateDate}" />
    <telerik:GridViewDataColumn Header="Volume" DataMemberBinding="{Binding Volume}" />
</telerik:RadGridView.Columns>
<telerik:RadContextMenu.ContextMenu>
    <telerik:RadContextMenu >
        <telerik:RadMenuItem Header="Delete selected Playlist" Name="ctxDeletePlaylist" Click="ctxDeletePlaylist_Click" />
        <telerik:RadMenuItem Header="Shuffle selected playlist" Name="ctxShufflePlaylist" Click="ctxShufflePlaylist_Click"></telerik:RadMenuItem>
    </telerik:RadContextMenu>
</telerik:RadContextMenu.ContextMenu>
</telerik:RadGridView>

attached screenshot is what i want to show exactly..

2 Answers, 1 is accepted

Sort by
0
Accepted
Dimitrina
Telerik team
answered on 28 Jun 2012, 09:12 AM
Hello,

 Please note that DateTime.Now can not be invoked when you use it in a condition of the StyleRule. 

I would recommend you to define the CellStyleSelector in code behind and work with the data item in order to return the style based on a condition.

You could check this help article for a reference.

All the best,
Didie
the Telerik team

Explore the entire Telerik portfolio by downloading the Ultimate Collection trial package. Get it now >>

0
Serkan
Top achievements
Rank 1
answered on 28 Jun 2012, 01:32 PM
Perfect :))
thank you very very much for fast reply.. it solved my problem, now the speed is incredible fast and this is what i exactly needed..

for help, here is my static resource in xaml:
<Grid.Resources>
    <my:scheduleDateStyleSelector x:Key="scheduleDateStyleSelector">
        <my:scheduleDateStyleSelector.ActiveStyle>
            <Style TargetType="telerik:GridViewCell">
                <Setter Property="Background" Value="Green" />
                <Setter Property="Foreground" Value="White" />
            </Style>
        </my:scheduleDateStyleSelector.ActiveStyle>
        <my:scheduleDateStyleSelector.PassiveStyle>
            <Style TargetType="telerik:GridViewCell">
                <Setter Property="Background" Value="Red"/>
                <Setter Property="Foreground" Value="White" />
            </Style>
        </my:scheduleDateStyleSelector.PassiveStyle>
    </my:scheduleDateStyleSelector>
    <my:scheduleTimeStyleSelector x:Key="scheduleTimeStyleSelector">
        <my:scheduleTimeStyleSelector.ActiveStyle>
            <Style TargetType="telerik:GridViewCell">
                <Setter Property="Background" Value="Green" />
                <Setter Property="Foreground" Value="White" />
            </Style>
        </my:scheduleTimeStyleSelector.ActiveStyle>
        <my:scheduleTimeStyleSelector.PassiveStyle>
            <Style TargetType="telerik:GridViewCell">
                <Setter Property="Background" Value="Red"/>
                <Setter Property="Foreground" Value="White" />
            </Style>
        </my:scheduleTimeStyleSelector.PassiveStyle>
    </my:scheduleTimeStyleSelector>
</Grid.Resources>

here how i used in gridcolumn:
<telerik:GridViewDataColumn Header="startDate" DataMemberBinding="{Binding startDate}"  CellStyleSelector="{StaticResource scheduleDateStyleSelector}" />


here is the class i generated:
public class scheduleDateStyleSelector:StyleSelector
   {
 
    
       public override Style SelectStyle(object item, DependencyObject container)
       {
           if (item is Schedules)
           {
               Schedules schedule = item as Schedules;
               if (schedule.startDate <=DateTime.Now && DateTime.Now<= schedule.endDate )
               {
                   return ActiveStyle;
               }
               else
               {
                   return PassiveStyle;
               }
           }
           return null;
       }
       public Style ActiveStyle { get; set; }
       public Style PassiveStyle { get; set; }
   }
   public class scheduleTimeStyleSelector : StyleSelector
   {
 
 
       public override Style SelectStyle(object item, DependencyObject container)
       {
           if (item is Schedules)
           {
               Schedules schedule = item as Schedules;
               if (schedule.startTime.TimeOfDay <= DateTime.Now.TimeOfDay && DateTime.Now.TimeOfDay <= schedule.endTime.TimeOfDay)
               {
                   return ActiveStyle;
               }
               else
               {
                   return PassiveStyle;
               }
           }
           return null;
       }
       public Style ActiveStyle { get; set; }
       public Style PassiveStyle { get; set; }
   }
 
and last, the xmlns definition usage on user control xmlns:my="clr-namespace:WebManager" 


<UserControl x:Class="WebManager.frmSchedules"
             xmlns:local="clr-namespace:WebManager"
    mc:Ignorable="d"
    d:DesignHeight="501" d:DesignWidth="1168" xmlns:sdk="http://schemas.microsoft.com/winfx/2006/xaml/presentation/sdk" xmlns:telerik="http://schemas.telerik.com/2008/xaml/presentation" xmlns:my="clr-namespace:WebManager" Loaded="UserControl_Loaded">



Tags
GridView
Asked by
Serkan
Top achievements
Rank 1
Answers by
Dimitrina
Telerik team
Serkan
Top achievements
Rank 1
Share this question
or