如何在日历asp.net中突出显示不同颜色的不同日期

时间:2014-11-24 01:07:49

标签: javascript jquery asp.net

我创建了突出显示所选日期的日历控件。但我不知道每天如何使用不同的颜色。

        <asp:Calendar ID="Calendar1" runat="server" 

            Height="365px" Width="594px" CssClass="myCalendar"
            OnDayRender="Calendar1_DayRender" OnSelectionChanged="Calendar1_SelectionChanged" >
            <DayHeaderStyle 
    CssClass="myCalendarDayHeader"/>
            <DayStyle CssClass="myCalendarDay" Font-Bold="True" Font-Names="Cordia New" 
                Font-Size="30px"/>
            <SelectedDayStyle 
    CssClass="myCalendarSelector" BackColor="#3366FF"/>
            <SelectorStyle Wrap="True" CssClass="myCalendarSelector"/>
            <TitleStyle 
    CssClass="myCalendarTitle" />
            <TodayDayStyle CssClass="myCalendarToday"/>
        </asp:Calendar>

...

 public static List<DateTime> list = new List<DateTime>();
    Hashtable HolidayList;
    protected void Page_Load(object sender, EventArgs e)
    {

    }
    protected void Calendar1_SelectionChanged(object sender, EventArgs e)
    {
        List<DateTime> newList = (List<DateTime>)Session["SelectedDates"];
        foreach (DateTime dt in newList)
        {
            Calendar1.SelectedDates.Add(dt);
        }
        list.Clear();
    }
    protected void Calendar1_DayRender(object sender, DayRenderEventArgs e)
    {

        if (e.Day.IsWeekend == true)
        {

            e.Cell.Enabled = false;
            e.Day.IsSelectable = false;
            e.Cell.BackColor = System.Drawing.Color.Gray;
        }

            if (e.Day.IsSelected == true)
            {
                list.Add(e.Day.Date);
                e.Day.IsSelectable = false;
            }
            Session["SelectedDates"] = list;


    }

我想添加一个单选按钮,以便我可以更改颜色,例如收音机一个是蓝色收音机二是黄色。任何人都可以有想法吗?

1 个答案:

答案 0 :(得分:1)

好的,试试这个

RadioButtonList AutoPostBack="true"OnSelectedIndexChanged事件添加到您的标记中,如下所示。

<asp:Calendar ID="Calendar1" runat="server" Height="365px" Width="594px" CssClass="myCalendar"
            OnDayRender="Calendar1_DayRender" OnSelectionChanged="Calendar1_SelectionChanged" >
            <DayHeaderStyle 
    CssClass="myCalendarDayHeader"/>
            <DayStyle CssClass="myCalendarDay" Font-Bold="True" Font-Names="Cordia New" 
                Font-Size="30px"/>
            <SelectedDayStyle 
    CssClass="myCalendarSelector" BackColor="#3366FF"/>
            <SelectorStyle Wrap="True" CssClass="myCalendarSelector"/>
            <TitleStyle 
    CssClass="myCalendarTitle" />
            <TodayDayStyle CssClass="myCalendarToday"/>
        </asp:Calendar>

    <asp:RadioButtonList ID="RadioButtonList1" runat="server" OnSelectedIndexChanged="RadioButtonList1_SelectedIndexChanged" AutoPostBack="true">
        <asp:ListItem>Red</asp:ListItem>
        <asp:ListItem>Yellow</asp:ListItem>
        <asp:ListItem>Green</asp:ListItem>
    </asp:RadioButtonList>

并且,在你的代码背后实现OnSelectedIndexChanged事件如下

protected void RadioButtonList1_SelectedIndexChanged(object sender, EventArgs e)
        {
            System.Drawing.Color selColor;
            switch(RadioButtonList1.SelectedValue)
            {
                case "Red": selColor = System.Drawing.Color.Red;
                    break;
                case "Yellow": selColor = System.Drawing.Color.Yellow;
                    break;
                default: selColor = System.Drawing.Color.Green;
                    break;
            }
            Calendar1.SelectedDayStyle.BackColor = selColor;

        }

那就是它!您选择的日期将以您在RadioButtonList控件中选择的颜色突出显示。玩得开心!