ASP.NET 魔法學院

在上篇文章中示範了整合 The Coolest DHTML Calendar 的日期控制項，是不是覺得這個 TBDateEdit 控制項少了些什麼東西？沒錯，就是與伺服端的互動，在本文將為 TBDateEdit 控制項加入 PostBack 動作，以及新增 TextChanged 事件。

首先新增 AutoPostBack 屬性，來設定是否觸發 PostBack 動作。因為 TextBox 本身就有 AutoPostBack 屬性，所以把 AutoPoskBack 屬性對應到內含 TextBox 的 AutoPostBack 屬性即可。

''' <summary> ''' 是否觸發 PostBack 動作。 ''' </summary> < _ Description("是否觸發 PostBack 動作。"), _ DefaultValue(False) _ > _ Public Property AutoPostBack() As Boolean Get Return FTextBox.AutoPostBack End Get Set(ByVal value As Boolean) FTextBox.AutoPostBack = value End Set End Property

再來就要定義 TextChanged 事件，如下

''' <summary> ''' 文字內容改變時所引發的事件。 ''' </summary> Public Event TextChanged(ByVal sender As Object, ByVal e As System.EventArgs)

在建構函式中，將 TextBox 的 TextChanged 事件，重新導向內部定義的 TextBox_TextChanged 方法，並在 TextBox_TextChanged 方法中，引發 TBDateEdit 的 TextChanged 事件。

Public Sub New() AddHandler FTextBox.TextChanged, AddressOf TextBox_TextChanged End Sub ''' <summary> ''' 攔截 TextBox 的 TextChanged 事件。 ''' </summary> Private Sub TextBox_TextChanged(ByVal sender As Object, ByVal e As System.EventArgs) '引發 TextChanged 事件 RaiseEvent TextChanged(Me, e) End Sub

再來就是要測試這個 TextChanged 事件是否正確，在頁面上放置一個 TBDateEdit 控制項，並將 AutoPostBack 設為 True。

<bee:TBDateEdit ID="TBDateEdit1" runat="server" AutoPostBack="True" />

在 TBDateEdit 的 TextChanged 事件撰寫測試程式碼，然後就可以執行你的測試程式。當 TBDateEdit 的內容改變時，就會產生 PostBack 動作，並引發 TBDateEdit 的 TextChanged 事件。

Protected Sub TBDateEdit1_TextChanged(ByVal sender As Object, ByVal e As System.EventArgs) Handles TBDateEdit1.TextChanged Label1.Text = CType(sender, Bee.Web.WebControls.TBDateEdit).Text End Sub

程式碼下載：TBDateEditDemo2.zip

ASP.NET 魔法學院