年-月-日 生日控件

在之前的项目中，应用了http://www.cnblogs.com/hkingh/articles/1739514.html生日选择下拉框范例。如下图：

 

解决了遇到的几问题：

一、原示例在除IE浏览器外，日所在下拉框不能正常显示。修改如下代码：

        function fillDay(day, days)
        {
            while (day.options.length > 0)
            {
                day.remove(0);
            }
            for (i = 1; i <= days; i++)
            {
                var oOption = document.createElement("OPTION");
                if (i < 10)
                {
                    oOption.innerHTML = "0" + i;
                    oOption.value = "0" + i;
                }
                else
                {
                    oOption.innerHTML = i;
                    oOption.value = i;
                }
                day.appendChild(oOption);
            }
        }

 

二、页面有回发，日下拉框将被刷新成01日。修改如下代码：

 

        //给年和月的onchange 绑定方法，用于处理闰年的情况
        Year.Attributes["onchange"] = "OnSelectChange(" + Year.ClientID + "," + Month.ClientID + "," + Day.ClientID + ");";
        Month.Attributes["onchange"] = "OnSelectChange(" + Year.ClientID + "," + Month.ClientID + "," + Day.ClientID + ");";
        Day.Attributes["onchange"] = "OnSelected(" + Day.ClientID + ");";

 

以下代码保存日下拉框被选择后，选择指定日期值。

 

        function OnSelected(day)
        {
            var currSelectText = day.options[day.selectedIndex].value;
            for (var i = 0; i < day.options.length; i++)
            {
                var option = day.options[i];
                option.selected = option.value == currSelectText;
            }
        }

 

三、在页面中使用两个生日控件时，第二生日控件绑定时将会使第一个控件也绑定为同样日期值。修改如下代码：

    protected void Page_Load(object sender, EventArgs e)
    {
        if(!Page.IsPostBack)
        {
            BindDateTime();

            sBindDateTime();

            Date = DateTime.Now;
            sDate = DateTime.Now;
        }
    }

    private void BindDateTime()
    {
        //填充DropDownList
        int i = 0;
        Year.Items.Clear();
        for(i = 1900;i <= DateTime.Now.Year;i++)
        {
            ListItem item = new ListItem(i.ToString(), i.ToString());
            Year.Items.Add(item);
        }

        Month.Items.Clear();
        for(i = 1;i <= 12;i++)
        {
            string t = i < 10 ? "0" + i.ToString() : i.ToString();
            ListItem item = new ListItem(t, t);
            Month.Items.Add(item);
        }

        Day.Items.Clear();
        for(i = 1;i <= 31;i++)
        {
            string t = i < 10 ? "0" + i.ToString() : i.ToString();
            ListItem item = new ListItem(t, t);
            Day.Items.Add(item);
        }

        //给年和月的onchange 绑定方法，用于处理闰年的情况
        Year.Attributes["onchange"] = "OnSelectChange(" + Year.ClientID + "," + Month.ClientID + "," + Day.ClientID + ");";
        Month.Attributes["onchange"] = "OnSelectChange(" + Year.ClientID + "," + Month.ClientID + "," + Day.ClientID + ");";
        Day.Attributes["onchange"] = "OnSelected(" + Day.ClientID + ");";
    }

    private void sBindDateTime()
    {
        //绑定配偶生日
        int i = 0;
        sYear.Items.Clear();
        for(i = 1900;i <= DateTime.Now.Year;i++)
        {
            ListItem item = new ListItem(i.ToString(), i.ToString());
            sYear.Items.Add(item);
        }

        sMonth.Items.Clear();
        for(i = 1;i <= 12;i++)
        {
            string t = i < 10 ? "0" + i.ToString() : i.ToString();
            ListItem item = new ListItem(t, t);
            sMonth.Items.Add(item);
        }

        sDay.Items.Clear();
        for(i = 1;i <= 31;i++)
        {
            string t = i < 10 ? "0" + i.ToString() : i.ToString();
            ListItem item = new ListItem(t, t);
            sDay.Items.Add(item);
        }

        sYear.Attributes["onchange"] = "OnSelectChange(" + sYear.ClientID + "," + sMonth.ClientID + "," + sDay.ClientID + ");";
        sMonth.Attributes["onchange"] = "OnSelectChange(" + sYear.ClientID + "," + sMonth.ClientID + "," + sDay.ClientID + ");";
        sDay.Attributes["onchange"] = "sOnSelected(" + sDay.ClientID + ");";
    }

以下是完整示例代码：

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" %>

<!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>
    <script type="text/javascript" language="javascript">
        var bigArray = new Array(1, 3, 5, 7, 8, 10, 12);
        function OnSelectChange(year, month, day)
        {
            if (month.value == 2)//选中的月份为2月
            {
                if (checkYear(year.value))//闰年
                {
                    fillDay(day, 29);
                }
                else
                {
                    fillDay(day, 28);
                }
            }
            else
            {
                if (inArray(month.value, bigArray))
                {
                    fillDay(day, 31);
                }
                else
                {
                    fillDay(day, 30);
                }
            }
        }

        function checkYear(year)
        {
            return (((year % 4 == 0) && (year % 100 != 0)) || (year % 400 == 0)) ? 1 : 0;
        }

        function fillDay(day, days)
        {
            while (day.options.length > 0)
            {
                day.remove(0);
            }
            for (i = 1; i <= days; i++)
            {
                var oOption = document.createElement("OPTION");
                if (i < 10)
                {
                    oOption.innerHTML = "0" + i;
                    oOption.value = "0" + i;
                }
                else
                {
                    oOption.innerHTML = i;
                    oOption.value = i;
                }
                day.appendChild(oOption);
            }
        }

        function inArray(oObj, oArray)
        {
            for (i = 0; i < oArray.length; i++)
            {
                if (oObj == oArray[i])
                {
                    return true;
                }
            }
            return false;
        }

        function OnSelected(day)
        {
            var currSelectText = day.options[day.selectedIndex].value;
            for (var i = 0; i < day.options.length; i++)
            {
                var option = day.options[i];
                option.selected = option.value == currSelectText;
            }
        }
    </script>
</head>
<body>
    <form id="form1" runat="server">
    <div>
        <span>本人生日：</span>
        <asp:DropDownList ID="Year" runat="server">
        </asp:DropDownList>
        <asp:DropDownList ID="Month" runat="server">
        </asp:DropDownList>
        <asp:DropDownList ID="Day" runat="server">
        </asp:DropDownList>
    </div>
    <div>
        <span>配偶生日：</span>
        <asp:DropDownList ID="sYear" runat="server" TabIndex="27">
        </asp:DropDownList>
        <asp:DropDownList ID="sMonth" runat="server" TabIndex="28">
        </asp:DropDownList>
        <asp:DropDownList ID="sDay" runat="server" TabIndex="29">
        </asp:DropDownList>
    </div>
    <div><asp:Button ID="btnSelect" runat="server" Text="Select" 
            onclick="btnSelect_Click" /></div>
    <div>
        <asp:Label ID="lblDate" runat="server" ></asp:Label>
        <asp:Label ID="lblSDate" runat="server" ></asp:Label>
    </div>
    </form>
</body>
</html>

 

using System;
using System.Web.UI;
using System.Web.UI.WebControls;

public partial class _Default : System.Web.UI.Page
{
    protected void Page_Load(object sender, EventArgs e)
    {
        if(!Page.IsPostBack)
        {
            BindDateTime();

            sBindDateTime();

            Date = DateTime.Now;
            sDate = DateTime.Now;
        }
    }

    private void BindDateTime()
    {
        //填充DropDownList
        int i = 0;
        Year.Items.Clear();
        for(i = 1900;i <= DateTime.Now.Year;i++)
        {
            ListItem item = new ListItem(i.ToString(), i.ToString());
            Year.Items.Add(item);
        }

        Month.Items.Clear();
        for(i = 1;i <= 12;i++)
        {
            string t = i < 10 ? "0" + i.ToString() : i.ToString();
            ListItem item = new ListItem(t, t);
            Month.Items.Add(item);
        }

        Day.Items.Clear();
        for(i = 1;i <= 31;i++)
        {
            string t = i < 10 ? "0" + i.ToString() : i.ToString();
            ListItem item = new ListItem(t, t);
            Day.Items.Add(item);
        }

        //给年和月的onchange 绑定方法，用于处理闰年的情况
        Year.Attributes["onchange"] = "OnSelectChange(" + Year.ClientID + "," + Month.ClientID + "," + Day.ClientID + ");";
        Month.Attributes["onchange"] = "OnSelectChange(" + Year.ClientID + "," + Month.ClientID + "," + Day.ClientID + ");";
        Day.Attributes["onchange"] = "OnSelected(" + Day.ClientID + ");";
    }

    private void sBindDateTime()
    {
        //绑定配偶生日
        int i = 0;
        sYear.Items.Clear();
        for(i = 1900;i <= DateTime.Now.Year;i++)
        {
            ListItem item = new ListItem(i.ToString(), i.ToString());
            sYear.Items.Add(item);
        }

        sMonth.Items.Clear();
        for(i = 1;i <= 12;i++)
        {
            string t = i < 10 ? "0" + i.ToString() : i.ToString();
            ListItem item = new ListItem(t, t);
            sMonth.Items.Add(item);
        }

        sDay.Items.Clear();
        for(i = 1;i <= 31;i++)
        {
            string t = i < 10 ? "0" + i.ToString() : i.ToString();
            ListItem item = new ListItem(t, t);
            sDay.Items.Add(item);
        }

        sYear.Attributes["onchange"] = "OnSelectChange(" + sYear.ClientID + "," + sMonth.ClientID + "," + sDay.ClientID + ");";
        sMonth.Attributes["onchange"] = "OnSelectChange(" + sYear.ClientID + "," + sMonth.ClientID + "," + sDay.ClientID + ");";
        sDay.Attributes["onchange"] = "OnSelected(" + sDay.ClientID + ");";
    }

    public DateTime Date
    {
        get
        {
            return DateTime.Parse(Year.SelectedValue + "-" + Month.SelectedValue + "-" + Day.SelectedValue);
        }
        set
        {
            SelectListItem(Year, value.ToString("yyyy"));
            SelectListItem(Month, value.ToString("MM"));
            SelectListItem(Day, value.ToString("dd"));
        }
    }

    public DateTime sDate
    {
        get
        {
            return DateTime.Parse(sYear.SelectedValue + "-" + sMonth.SelectedValue + "-" + sDay.SelectedValue);
        }
        set
        {
            SelectListItem(sYear, value.ToString("yyyy"));
            SelectListItem(sMonth, value.ToString("MM"));
            SelectListItem(sDay, value.ToString("dd"));
        }
    }

    /// <summary>
    /// Selects item
    /// </summary>
    /// <param name="list">List</param>
    /// <param name="value">Value to select</param>
    public static void SelectListItem(DropDownList list, object value)
    {
        if(list.Items.Count != 0)
        {
            var selectedItem = list.SelectedItem;
            if(selectedItem != null)
                selectedItem.Selected = false;
            if(value != null)
            {
                selectedItem = list.Items.FindByValue(value.ToString());
                if(selectedItem != null)
                    selectedItem.Selected = true;
            }
        }
    }

    protected void btnSelect_Click(object sender, EventArgs e)
    {
        lblDate.Text = Date.ToLongDateString();
        lblSDate.Text = sDate.ToLongDateString();
    }
}