编程语言

img sizheng0320

用户控件形式的多选日历控件MultiSelectCalendar

发表于2004/9/20 22:53:00  2605人阅读

分类: .NET

问题的提出:

在开发系统的过程中,曾遇到过为职工排休的情况,当时想的就是应该用日历控件,直观方便。但是ASP.NET中的日历控件默认是单选的,每次点击一个日期就会引发postback,每次postback后控件的SelectedDates属性就会被刷新,而该控件又没有可以设为falseautopostback属性,那么要想实现日期的多选,就只能靠自己来写了。经过考虑之后,认为实现这个功能,关键在于将每次选择的日期集合保存起来,在页面postback后重新生成时根据这个集合中的元素绘制日历中的单元格的样式。

实现的思路就是将所选的日期用一个集合保存,并保留在Session中。每次点击一个日期时,都检验集合中是否已经有该日了,如果有,则删除,如果没有则添加。这样就能实现用鼠标点击选择、已经选择的点击后取消的效果。

 

具体实现:

新建一个WEB用户控件,命名为MultiSelectCalendar,在设计视图中拖入一个普通的日历控件,命名为MultiCalendar,为了美观,在“自动套用格式”中选择专业2型。下面是源代码。

Public Class MultiSelectCalendar

    Inherits System.Web.UI.UserControl

 

#Region " Web 窗体设计器生成的代码 "

     省略

#End Region

 

    Private colDt As SelectedDatesCollection

 

    Private Sub Page_Load(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles MyBase.Load

        '在此处放置初始化页的用户代码

        If Not IsPostBack Then

            colDt = MultiCalendar.SelectedDates

            Session("date") = colDt

        Else

            colDt = Session("date")

        End If

    End Sub

 

    Private Sub MultiCalendar_DayRender(ByVal sender As System.Object, ByVal e As System.Web.UI.WebControls.DayRenderEventArgs) Handles MultiCalendar.DayRender

        Dim ctlCell As TableCell

        Dim dt As Date

 

        If e.Day.IsOtherMonth Then

            e.Cell.Controls.Clear()

        End If

        If colDt.Contains(e.Day.Date) Then

            e.Cell.BackColor = Color.FromArgb(51, 51, 153)

            e.Cell.ForeColor = Color.White

        Else

            e.Cell.BackColor = Color.LightGray

            e.Cell.ForeColor = Color.Black

        End If

    End Sub

 

    Private Sub MultiCalendar_PreRender(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles MultiCalendar.PreRender

        If IsPostBack Then

            If Not colDt.Contains(MultiCalendar.SelectedDate) Then

                colDt.Add(MultiCalendar.SelectedDate)

            Else

                colDt.Remove(MultiCalendar.SelectedDate)

            End If

            Session("date") = colDt

        End If

    End Sub

End Class

 

其中变量colDt用来保存所选日期的集合。可以看到,实现比较简单,完全是在控件自有的事件、方法中实现的,而无需自己编写额外的函数。如果在三个函数中设置断点,可以看到三个函数的执行顺序是Page_LoadMultiCalendar_PreRenderMultiCalendar_DayRender搞清楚逻辑顺序是非常重要的。

最后我们可以在.ascx上添加一个列表框来测试一下,将MultiCalendar_PreRender修改成下面的样子,就可以在列表框中列出被选日期集合中的所有日期。

Private Sub MultiCalendar_PreRender(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles MultiCalendar.PreRender

        If IsPostBack Then

            If Not colDt.Contains(MultiCalendar.SelectedDate) Then

                colDt.Add(MultiCalendar.SelectedDate)

            Else

                colDt.Remove(MultiCalendar.SelectedDate)

            End If

            Session("date") = colDt

        End If

 

        Dim dt As Date

        ListBox1.Items.Clear()

        For Each dt In colDt

            ListBox1.Items.Add(dt.ToString)

        Next

End Sub

注意到在这个函数中,代码是括在了If IsPostBack中间的,因为我在用列表框做测试时,发现第一次打开页面的时候,会在集合里面添加000111日零点这个日期,不知道为什么,难道是日历控件默认的被选日期?

 

总结:

多选日历控件的基本功能抽取成了一个WEB用户控件,提高了代码的可重用性,但还有可以改进的地方。如应该考虑将日期集合暴露成一个只读属性,还可以考虑将外观相关的一些设置暴露为属性,在用户控件中如何实现还在学习中。最后完善成能够直接引用进工具箱的控件最好。

阅读全文
0 0

相关文章推荐

img
取 消
img