AJAX中日历控件的应用
?閱讀全文并下載:http://www.cckan.net/forum.php?mod=viewthread&tid=44
<%@ Page
CodeLanguage="C#"?AutoEventWireup="true"???CodeFile="Default.aspx.cs"?Inherits="_Default"?%>
<%@?Register?assembly="AjaxControlToolkit"?namespace="AjaxControlToolkit"?tagprefix="cc1"?%>
<!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>無標(biāo)題頁</title>
</head>
<body>
?????<form?id="form1"?runat="server">
?????<asp:ScriptManager?ID="ScriptManager1"???runat="server"?EnableScriptGlobalization?="true"?>
?????</asp:ScriptManager>
?????<div>
?????</div>
?????<cc1:CalendarExtender?ID="CalendarExtender1"?runat="server"?
?????????TargetControlID="TextBox1">
?????</cc1:CalendarExtender>
?????<asp:TextBox?ID="TextBox1"?runat="server"></asp:TextBox>
?????</form>
</body>
</html>
?
下面是怎么加樣式的應(yīng)用
每個(gè)頁面中有且只有一個(gè)的scriptmanager控件,一個(gè)文本框控件,一個(gè)AutoComplete控件,一個(gè)Calendar控件,這里為了簡(jiǎn)單兩個(gè)控件的TargetControl都是同一個(gè)文本框。
當(dāng)然別忘了頁面開始的那句話:
<asp:TextBox?ID="SearchText"??Width="150px"?runat="server"?/>
<input?type?="button"?id?="show"?/>
????????????????????????
<ajaxToolkit:CalendarExtender?TargetControlID?="SearchText"?CssClass="MyCalendar"?
??????runat?="server"??PopupButtonID="show"?ID?="Calendar"?Animated="true"?
??????Format="yyyy-MM-dd"?Enabled="true"></ajaxToolkit:CalendarExtender>
??????
<ajaxToolkit:AutoCompleteExtender?runat="server"?ID="AutoCompleteSearch"
?????????MinimumPrefixLength="1"?TargetControlID="SearchText"
?????????ServicePath="AutoCompleteService.asmx"
?????????ServiceMethod="GetSearchTerms"></ajaxToolkit:AutoCompleteExtender>
?
首先來試試日歷控件。TargetControlID就是日歷控件要顯示在哪個(gè)控件的下方,這里是SearchText文本框,Format是日期的格式。這里需要注意的是PopupButtonID,如果不設(shè)置這個(gè)屬性,日歷控件就在TargetControl獲得焦點(diǎn)的時(shí)候顯示,選擇日期后也不會(huì)消失,而必須在TargetControl失去焦點(diǎn)的時(shí)候才消失,設(shè)置PopupButtonID屬性,當(dāng)點(diǎn)擊這個(gè)Button的時(shí)候日歷控件在TargetControl下方顯示,選擇日期后就消失,或者點(diǎn)擊按鈕消失。?????????
下面是日歷控件的CSS,目前就知道這些:
?
.MyCalendar?.ajax__calendar_container?{
?????border:1px?solid?#646464;background-color:#C0AB80;?color:?#FC2628;?background-image:url(../Images/large62230.jpg);
}
?????.MyCalendar?.ajax__calendar_other?.ajax__calendar_day,
?????.MyCalendar?.ajax__calendar_other?.ajax__calendar_year?
?????{
??????????color:?black;
?????}
?.MyCalendar?.ajax__calendar_hover?.ajax__calendar_day,
?.MyCalendar?.ajax__calendar_hover?.ajax__calendar_month,
?.MyCalendar?.ajax__calendar_hover?.ajax__calendar_year
??{????color:#6E52DB;?font-size:medium;}
??.MyCalendar?.ajax__calendar_active?.ajax__calendar_day,
??.MyCalendar?.ajax__calendar_active?.ajax__calendar_month,
??.MyCalendar?.ajax__calendar_active?.ajax__calendar_year?
??{????color:?black;??font-weight:bold;}
?
?
?
?
轉(zhuǎn)載于:https://www.cnblogs.com/sufei/archive/2009/03/14/1411689.html
總結(jié)
以上是生活随笔為你收集整理的AJAX中日历控件的应用的全部?jī)?nèi)容,希望文章能夠幫你解決所遇到的問題。
- 上一篇: 利用DataSet对Xml文件操作
- 下一篇: 读取Excel表格数据到DataGrid