ASP.Net Calendar控件 如何取消选择日期

时间：2020-12-09 18:10:56
ASP.Net Calendar控件 如何取消选择日期？
就是我选择了某个日期，然后这个日期颜色会变成其他颜色，然后我点另一个日期控件，让前一个日期控件的选择日期消失，该怎么做？

8 个解决方案

#1

居然没人啊？

#2

难道真没人知道？

#3

你自己运行页面查看源代码文件就会发现被你选择的日期跟其他的日期样式是不一样的，那么你就可以通过js修改样式就可以了啊

#4

引用 3 楼 chen_ya_ping 的回复:
你自己运行页面查看源代码文件就会发现被你选择的日期跟其他的日期样式是不一样的，那么你就可以通过js修改样式就可以了啊

js不懂啊。。。

#5



 protected void Calendar1_SelectionChanged(object sender, EventArgs e)

        {

            this.Calendar1.SelectedDayStyle.BackColor = Color.White;

            this.Calendar1.SelectedDayStyle.ForeColor = Color.Black; ;

        }

这个可以达到你要的效果，其实是错觉

#6

其实如果搞清楚asp.net控件的用法，写程序还是非常简单的。

给你写了个demo，把下面代码复制到你网站上的aspx文件中，测试一下： 
<%@ Page Language="C#" %>


<script runat="server">

    protected void Calendar1_SelectionChanged(object sender, EventArgs e)

    {

        Calendar2.DataBind();

        UpdatePanel2.Update();

    }

    protected void Calendar2_DayRender(object sender, DayRenderEventArgs e)

    {

        if (e.Day.Date == Calendar1.SelectedDate)

            e.Cell.Enabled = false;

    }

</script>


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head runat="server">

    <title></title>

</head>

<body>

    <form id="form1" runat="server">

    <asp:ScriptManager ID="ScriptManager1" runat="server" />

    <table>

        <tr>

            <td valign="top">

                第一个日期控件：

            </td>

            <td>

                <asp:UpdatePanel ID="UpdatePanel1" runat="server" UpdateMode="Conditional">

                    <ContentTemplate>

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

                            BackColor="White" BorderColor="#999999" CellPadding="4" DayNameFormat="Shortest"

                            Font-Names="Verdana" Font-Size="8pt" ForeColor="Black" Height="180px" Width="200px">

                            <SelectedDayStyle BackColor="#666666" Font-Bold="True" ForeColor="White" />

                            <SelectorStyle BackColor="#CCCCCC" />

                            <WeekendDayStyle BackColor="#FFFFCC" />

                            <TodayDayStyle BackColor="#CCCCCC" ForeColor="Black" />

                            <OtherMonthDayStyle ForeColor="#808080" />

                            <NextPrevStyle VerticalAlign="Bottom" />

                            <DayHeaderStyle BackColor="#CCCCCC" Font-Bold="True" Font-Size="7pt" />

                            <TitleStyle BackColor="#999999" BorderColor="Black" Font-Bold="True" />

                        </asp:Calendar>

                    </ContentTemplate>

                </asp:UpdatePanel>

            </td>

        </tr>

        <tr>

            <td>

            </td>

            <td>

            </td>

        </tr>

        <tr>

            <td>

            </td>

            <td>

            </td>

        </tr>

        <tr>

            <td valign="top">

                第二个日期控件

            </td>

            <td>

                <asp:UpdatePanel ID="UpdatePanel2" runat="server" UpdateMode="Conditional">

                    <ContentTemplate>

                        <asp:Calendar ID="Calendar2" runat="server" OnDayRender="Calendar2_DayRender" BackColor="White"

                            BorderColor="Black" BorderStyle="Solid" CellSpacing="1" Font-Names="Verdana"

                            Font-Size="9pt" ForeColor="Black" Height="250px" NextPrevFormat="ShortMonth"

                            Width="330px">

                            <SelectedDayStyle BackColor="#333399" ForeColor="White" />

                            <TodayDayStyle BackColor="#999999" ForeColor="White" />

                            <OtherMonthDayStyle ForeColor="#999999" />

                            <DayStyle BackColor="#CCCCCC" />

                            <NextPrevStyle Font-Bold="True" Font-Size="8pt" ForeColor="White" />

                            <DayHeaderStyle Font-Bold="True" Font-Size="8pt" ForeColor="#333333" Height="8pt" />

                            <TitleStyle BackColor="#333399" BorderStyle="Solid" Font-Bold="True" Font-Size="12pt"

                                ForeColor="White" Height="12pt" />

                        </asp:Calendar>

                    </ContentTemplate>

                </asp:UpdatePanel>

            </td>

        </tr>

    </table>

    </form>

</body>

</html>

#7

再给你一个demo: 
<%@ Page Language="C#" %>


<%@ Import Namespace="System.Collections.Generic" %>


<script runat="server">

    private List<DateTime> 选择过的日期

    {

        get

        {

            var x = ViewState["sd"];

            if (x == null)

            {

                x = new List<DateTime>();

                ViewState["sd"] = x;

            }

            return (List<DateTime>)x;

        }

    }


    protected void Calendar1_SelectionChanged(object sender, EventArgs e)

    {

        if (!选择过的日期.Contains(Calendar1.SelectedDate))

            选择过的日期.Add(Calendar1.SelectedDate);

        Calendar1.DataBind();

    }


    protected void Calendar1_DayRender(object sender, DayRenderEventArgs e)

    {

        if (选择过的日期.Contains(e.Day.Date))

            e.Cell.Enabled = false;

    }


    protected void Button1_Click(object sender, EventArgs e)

    {

        选择过的日期.Clear();

        Calendar1.DataBind();

    }

</script>


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head runat="server">

    <title></title>

</head>

<body>

    <form id="form1" runat="server">

    <asp:ScriptManager ID="ScriptManager1" runat="server" />

    <table>

        <tr>

            <td valign="top">

                日期控件：

            </td>

            <td>

                <asp:UpdatePanel ID="UpdatePanel1" runat="server" UpdateMode="Conditional">

                    <ContentTemplate>

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

                            BackColor="White" BorderColor="#999999" CellPadding="4" DayNameFormat="Shortest"

                            Font-Names="Verdana" Font-Size="8pt" ForeColor="Black" Height="180px" Width="200px"

                            OnDayRender="Calendar1_DayRender">

                            <SelectedDayStyle BackColor="#666666" Font-Bold="True" ForeColor="White" />

                            <SelectorStyle BackColor="#CCCCCC" />

                            <WeekendDayStyle BackColor="#FFFFCC" />

                            <TodayDayStyle BackColor="#CCCCCC" ForeColor="Black" />

                            <OtherMonthDayStyle ForeColor="#808080" />

                            <NextPrevStyle VerticalAlign="Bottom" />

                            <DayHeaderStyle BackColor="#CCCCCC" Font-Bold="True" Font-Size="7pt" />

                            <TitleStyle BackColor="#999999" BorderColor="Black" Font-Bold="True" />

                        </asp:Calendar>

                        <asp:Button ID="Button1" runat="server" OnClick="Button1_Click" Text="重新设置" />

                    </ContentTemplate>

                </asp:UpdatePanel>

            </td>

        </tr>

    </table>

    </form>

</body>

</html>

#8

谢谢。。

#1

居然没人啊？

#2

难道真没人知道？

#3

你自己运行页面查看源代码文件就会发现被你选择的日期跟其他的日期样式是不一样的，那么你就可以通过js修改样式就可以了啊

#4

引用 3 楼 chen_ya_ping 的回复:
你自己运行页面查看源代码文件就会发现被你选择的日期跟其他的日期样式是不一样的，那么你就可以通过js修改样式就可以了啊

js不懂啊。。。

#5



 protected void Calendar1_SelectionChanged(object sender, EventArgs e)

        {

            this.Calendar1.SelectedDayStyle.BackColor = Color.White;

            this.Calendar1.SelectedDayStyle.ForeColor = Color.Black; ;

        }

这个可以达到你要的效果，其实是错觉

#6

其实如果搞清楚asp.net控件的用法，写程序还是非常简单的。

给你写了个demo，把下面代码复制到你网站上的aspx文件中，测试一下： 
<%@ Page Language="C#" %>


<script runat="server">

    protected void Calendar1_SelectionChanged(object sender, EventArgs e)

    {

        Calendar2.DataBind();

        UpdatePanel2.Update();

    }

    protected void Calendar2_DayRender(object sender, DayRenderEventArgs e)

    {

        if (e.Day.Date == Calendar1.SelectedDate)

            e.Cell.Enabled = false;

    }

</script>


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head runat="server">

    <title></title>

</head>

<body>

    <form id="form1" runat="server">

    <asp:ScriptManager ID="ScriptManager1" runat="server" />

    <table>

        <tr>

            <td valign="top">

                第一个日期控件：

            </td>

            <td>

                <asp:UpdatePanel ID="UpdatePanel1" runat="server" UpdateMode="Conditional">

                    <ContentTemplate>

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

                            BackColor="White" BorderColor="#999999" CellPadding="4" DayNameFormat="Shortest"

                            Font-Names="Verdana" Font-Size="8pt" ForeColor="Black" Height="180px" Width="200px">

                            <SelectedDayStyle BackColor="#666666" Font-Bold="True" ForeColor="White" />

                            <SelectorStyle BackColor="#CCCCCC" />

                            <WeekendDayStyle BackColor="#FFFFCC" />

                            <TodayDayStyle BackColor="#CCCCCC" ForeColor="Black" />

                            <OtherMonthDayStyle ForeColor="#808080" />

                            <NextPrevStyle VerticalAlign="Bottom" />

                            <DayHeaderStyle BackColor="#CCCCCC" Font-Bold="True" Font-Size="7pt" />

                            <TitleStyle BackColor="#999999" BorderColor="Black" Font-Bold="True" />

                        </asp:Calendar>

                    </ContentTemplate>

                </asp:UpdatePanel>

            </td>

        </tr>

        <tr>

            <td>

            </td>

            <td>

            </td>

        </tr>

        <tr>

            <td>

            </td>

            <td>

            </td>

        </tr>

        <tr>

            <td valign="top">

                第二个日期控件

            </td>

            <td>

                <asp:UpdatePanel ID="UpdatePanel2" runat="server" UpdateMode="Conditional">

                    <ContentTemplate>

                        <asp:Calendar ID="Calendar2" runat="server" OnDayRender="Calendar2_DayRender" BackColor="White"

                            BorderColor="Black" BorderStyle="Solid" CellSpacing="1" Font-Names="Verdana"

                            Font-Size="9pt" ForeColor="Black" Height="250px" NextPrevFormat="ShortMonth"

                            Width="330px">

                            <SelectedDayStyle BackColor="#333399" ForeColor="White" />

                            <TodayDayStyle BackColor="#999999" ForeColor="White" />

                            <OtherMonthDayStyle ForeColor="#999999" />

                            <DayStyle BackColor="#CCCCCC" />

                            <NextPrevStyle Font-Bold="True" Font-Size="8pt" ForeColor="White" />

                            <DayHeaderStyle Font-Bold="True" Font-Size="8pt" ForeColor="#333333" Height="8pt" />

                            <TitleStyle BackColor="#333399" BorderStyle="Solid" Font-Bold="True" Font-Size="12pt"

                                ForeColor="White" Height="12pt" />

                        </asp:Calendar>

                    </ContentTemplate>

                </asp:UpdatePanel>

            </td>

        </tr>

    </table>

    </form>

</body>

</html>

#7

再给你一个demo: 
<%@ Page Language="C#" %>


<%@ Import Namespace="System.Collections.Generic" %>


<script runat="server">

    private List<DateTime> 选择过的日期

    {

        get

        {

            var x = ViewState["sd"];

            if (x == null)

            {

                x = new List<DateTime>();

                ViewState["sd"] = x;

            }

            return (List<DateTime>)x;

        }

    }


    protected void Calendar1_SelectionChanged(object sender, EventArgs e)

    {

        if (!选择过的日期.Contains(Calendar1.SelectedDate))

            选择过的日期.Add(Calendar1.SelectedDate);

        Calendar1.DataBind();

    }


    protected void Calendar1_DayRender(object sender, DayRenderEventArgs e)

    {

        if (选择过的日期.Contains(e.Day.Date))

            e.Cell.Enabled = false;

    }


    protected void Button1_Click(object sender, EventArgs e)

    {

        选择过的日期.Clear();

        Calendar1.DataBind();

    }

</script>


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head runat="server">

    <title></title>

</head>

<body>

    <form id="form1" runat="server">

    <asp:ScriptManager ID="ScriptManager1" runat="server" />

    <table>

        <tr>

            <td valign="top">

                日期控件：

            </td>

            <td>

                <asp:UpdatePanel ID="UpdatePanel1" runat="server" UpdateMode="Conditional">

                    <ContentTemplate>

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

                            BackColor="White" BorderColor="#999999" CellPadding="4" DayNameFormat="Shortest"

                            Font-Names="Verdana" Font-Size="8pt" ForeColor="Black" Height="180px" Width="200px"

                            OnDayRender="Calendar1_DayRender">

                            <SelectedDayStyle BackColor="#666666" Font-Bold="True" ForeColor="White" />

                            <SelectorStyle BackColor="#CCCCCC" />

                            <WeekendDayStyle BackColor="#FFFFCC" />

                            <TodayDayStyle BackColor="#CCCCCC" ForeColor="Black" />

                            <OtherMonthDayStyle ForeColor="#808080" />

                            <NextPrevStyle VerticalAlign="Bottom" />

                            <DayHeaderStyle BackColor="#CCCCCC" Font-Bold="True" Font-Size="7pt" />

                            <TitleStyle BackColor="#999999" BorderColor="Black" Font-Bold="True" />

                        </asp:Calendar>

                        <asp:Button ID="Button1" runat="server" OnClick="Button1_Click" Text="重新设置" />

                    </ContentTemplate>

                </asp:UpdatePanel>

            </td>

        </tr>

    </table>

    </form>

</body>

</html>

#8

谢谢。。
标签：

相关文章