?

　　Toolkit中給我們提供了很漂亮的CalendarExtender，而且我們還可以通過CSS自定義其顯示的樣式。今天簡單學(xué)習(xí)下這個控件的簡單使用。

　　還是先看效果。

　　

　　首先，提示輸入textbox中的內(nèi)容，然后點擊button按鈕。

　　

　　隨后彈出來日歷選項，如上圖所示，沒什么好說的。

　　

　　選擇自己的需要，然后返回一個日期到textbox中。

　　在這例子中。使用的控件是一個label，一個textbox，一個button。

　　Ajax中的介紹過的TextBoxWatermarkExtender，和將要介紹的，CalendarExtender。

　　TextBoxWatermarkExtender不用多說，用來控制textbox顯示之前的內(nèi)容。而CalendarExtender的TargetControlID自然是textbox，而PopupButtonID是指那個按鈕觸發(fā)彈出的日歷，我們也可以選擇一個自己喜歡需要的圖片來代替，更加好看。CSS可以用來控制其樣式的，鄙人水平有限，大家自己發(fā)揮吧。

　　后臺也沒有什么代碼，前臺一起分享。

　　

<form id="form1" runat="server">
<div>
<asp:ScriptManager ID="sm" runat="server">
</asp:ScriptManager>
<asp:UpdatePanel ID="updatePanel1" runat="server">
<ContentTemplate>
<asp:Label ID="lb_date" runat="server" Text="Input your birth:"></asp:Label>
<asp:TextBox ID="tb_date" runat="server" Text=""></asp:TextBox>
<asp:Button ID="btn" runat="server" Text="choose" />
<ajax:TextBoxWatermarkExtender ID="water_tb" runat="server" TargetControlID="tb_date"
WatermarkText="choose date" WatermarkCssClass="textbox">
</ajax:TextBoxWatermarkExtender>
<ajax:CalendarExtender ID="ce_tb" runat="server" TargetControlID="tb_date" PopupButtonID="btn"
Format="MM-d-yyyy" CssClass="cal">
</ajax:CalendarExtender>
</ContentTemplate>
</asp:UpdatePanel>
</div>
</form>

　　

總結(jié)

以上是生活随笔為你收集整理的Ajax Toolkit 控件学习系列(5) ——CalendarExtender使用的全部內(nèi)容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網(wǎng)站內(nèi)容還不錯，歡迎將生活随笔推薦給好友。