AJAX CONTROL TOOLKIT 34个服务器端控件

AjaxToollit3.5使用整理1 AlwaysVisibleControl最前端显示滚动块 (2)2 AnimationExtender动画效果无 (2)3 AutoCompleteExtender文本框自动填写 (2)4 CalendarExtender日历 (3)5 CascadingDropDown级联控件扩展，如下拉列表 (3)6 CollapsiblePanelExtender 面板控件扩展隐藏或显现面板 (7)7 ConfirmButtonExtender确认弹出窗口 (7)8 ModalPopupExtender模态面板，原页面灰显 (7)9 DragPanelExtender 生成一个可拖动的Panel (8)10 DropDownExtender 使一个Label扩展为DropDownList (8)11 DropShadowExtender 使控件下生成阴影形成立体效果 (9)12 DynamicPopulateExtender 生成Html替换掉控件 (9)13 FilteredTextBoxExtender 输入文本过滤 (9)14 HoverMenuExtender 扩展GridView鼠标放上显示编辑，删除等菜单无 (9)15 ListSearchExtender List类控件扩展无 (9)16 MaskedEditExtender 输入控件格式设置扩展 (9)17 MaskedEditV alidator输入控件验证扩展，配合MaskedEditExtender使用 (10)18 MutuallyExc lusiveCheckBoxExtender 使用CheckBox实现RadioButtonList的功能 (11)19 NoBot 无 (11)20 NumericUpDownExtender 在文本框上添加向上向下小按钮来选择 (11)21 PagingBulletedListExtender 扩展BulletedList使其按指定条件筛选 (12)22 PasswordStrength 密码强度判断 (13)23 PopupControl 无 (14)24 Rating 五个代表等级的星星选择评分 (14)25 ReorderList 生成一个可以鼠标拖动排序的列表；无 (15)26 ResizableControl 生成一个可拖动改变大小的控件无 (15)27 RoundedCornersExtender 设置控件的边角弧度无 (15)28 SliderExtender 扩展TextBox形成一个滑块，可用鼠标拖动 (15)29 SlideShowExtender 扩展Image控件生成幻灯片效果 (15)30 TabPanel 形成Tab页效果，不多写了 (16)31 TextBoxWatermark 在填入前文本框内的提示，获得焦点后隐藏 (16)32 ToggleButtonExtender将CheckBox前的小圆点替换成其他图标无 (17)33 UpdatePanelAnimation 更新数据时的动画效果 (17)34 V alidatorCalloutExtender 验证控件扩展弹出提示框动画 (17)未注明则下列控件皆略去runat,ID等服务器控件通用必填属性1 AlwaysVisibleControl最前端显示滚动块使一个面板总在屏幕上；一般用于广告；控件必须包含如下属性：TargetControlID：要控制的控件ID;VerticalSide：垂直停靠位置，可选项Top,Bottom,Middle;VerticalOffset：控件垂直偏移值，正数字，表示偏移像素；HorizontalOffset：控件水平停靠位置，可选项Left,Right,Center;HorizontalOffset: 控件水平偏移值，正数字，表示偏移像素；ScrollEffectDuration：页面变动时移动到新位置所需时间，正数字，表示秒数；2 AnimationExtender动画效果无3 AutoCompleteExtender文本框自动填写根据用户输入字符串时自动提供备选项，项搜索引擎的查询条件输入框；控件必须包含如下属性：TargetControlID：要控制的控件ID;ServicePath：指定自动完成功能Web Service的路径如ServicePath="AutoCompleteService.asmx" ；ServiceMethod：指定自动完成功能Web Method的名称ServiceMethod="GetWordList"；MinimumPrefixLength：开始提供自动完成列表的文本框内最少的输入字符数量；CompletionSetCount：是指列表列出输入提示即可选项的数量；需要如下格式的WebService支持：红色部分不可更改using System;using System.Collections.Generic;using System.Web.Services;[WebService(Namespace = "/")][WebServiceBinding(ConformsTo = WsiProfiles.BasicProfile1_1)][System.Web.Script.Services.ScriptService]public class AutoComplete : WebService{public AutoComplete(){}[WebMethod]public string[] GetCompletionList(string prefixText, int count){if (count == 0){count = 10;}if (prefixText.Equals("xyz")){return new string[0];}Random random = new Random();List<string> items = new List<string>(count);for (int i = 0; i < count; i++){char c1 = (char) random.Next(65, 90);char c2 = (char) random.Next(97, 122);char c3 = (char) random.Next(97, 122);items.Add(prefixText + c1 + c2 + c3);}return items.ToArray();}4 CalendarExtender日历在文本框上绑定一个日历控件，使文本框获得焦点时弹出日历框；控件必须包含如下属性：TargetControlID：要控制的控件ID;可选属性：PopupButtonID：控制弹出和收回的控件；一般为一个带有日历图标的按钮；PopupPosition：日历弹出位置，相对目标控件偏移位置；Format：选中的日期格式，字符串如"yyyy-mm-dd"；5 CascadingDropDown级联控件扩展，如下拉列表一般是在多个DropdownList控件绑定多个CascadingDropDown控件，按顺序必须选中第一个后第二个才可选并根据第一个控件的选中项加载可选项；控件必须包含如下属性：TargetControlID：要控制的控件ID;Category：目标控件的数据项，会显示在目标控件前作为标题，例如：“供电公司：”PromptText：控件默认显示项即第一项，一般为提示，例如：“选择一个供电公司”LoadingText：加载下级控件项时显示的提示文本，例如：“[正在加载…]”;ServicePath: 提供数据的WebService路径，例如：“CarsService.asmx”；ServiceMethod：提供数据的WebService方法，例如：“GetDropDownContents”；ParentControlID：父控件ID，首级控件可以不写；页面后台添加如下命名空间和方法：using System.Web.Services;using AjaxControlToolkit;//此方法内容不能更改[WebMethod][System.Web.Script.Services.ScriptMethod]public static CascadingDropDownNameValue[] GetDropDownContentsPageMethod(string knownCategoryValues, string category){return new CarsService().GetDropDownContents(knownCategoryValues, category);}所需WebService如下：using System;using System.Collections.Specialized;using System.Text.RegularExpressions;using System.Web;using System.Web.Services;using System.Xml;[WebService(Namespace = "/")][WebServiceBinding(ConformsTo = WsiProfiles.BasicProfile1_1)][System.Web.Script.Services.ScriptService]public class CarsService : WebService{//为了简单描述功能，所以采用Xml数据源private static XmlDocument _document;private static Regex _inputValidationRegex;private static object _lock = new object();// 取得数据源；public static XmlDocument Document{get{lock (_lock){if (_document == null){// 从文件加载数据_document = new XmlDocument();_document.Load(HttpContext.Current.Server.MapPath("~/App_Data/CarsService.xml")); }}return _document;}}//列出数据层级，本例共三级如下：public static string[] Hierarchy{get { return new string[] { "make", "model","color" }; }}//输入有效性验证，非必须；public static Regex InputValidationRegex{get{lock (_lock){if (null == _inputValidationRegex){_inputValidationRegex = new Regex("^[0-9a-zA-Z \\(\\)]*$"); }}return _inputValidationRegex;}}///<summary>///级联控件扩展方法，签名和内容不可更改///</summary>[WebMethod]public AjaxControlToolkit.CascadingDropDownNameValue[] GetDropDownContents(string knownCategoryValues, string category){StringDictionary knownCategoryValuesDictionary =AjaxControlToolkit.CascadingDropDown.ParseKnownCategoryValuesString(knownCategoryValues) ;returnAjaxControlToolkit.CascadingDropDown.QuerySimpleCascadingDropDownDocument(Document, Hierarchy, knownCategoryValuesDictionary, category, InputValidationRegex);}}本例加载的xml如下：<?xml version="1.0"encoding="utf-8" ?><CarsService><make name="Acura"><model name="Integra"><color name="Green" /><color name="Sea Green" /><color name="Pale Green" /></model><model name="RL"><color name="Red" /><color name="Bright Red" /></model><model name="TL"><color name="Teal" /><color name="Dark Teal" /></model></make></CarsService>6 CollapsiblePanelExtender 面板控件扩展隐藏或显现面板点击某个区域浮动隐藏或显示一块面板控件必须包含如下属性：TargetControlID：要控制的控件ID；ExpandControlID：控制浮动面板的控件ID，即在该控件上点击显示面板；CollapseControlID：控制浮动面板的控件ID，即在该控件上点击隐藏面板；Collapsed：初始时是否显示面板，True为不显示；可选属性：ImageControlID：在展开和隐藏面板时变动的图标控件，一般为ImageControl，包含在TargetControl里或TargetControl本身就是TargetControl，在面板展开和隐藏时图案在ExpandedImage，CollapsedImage属性指定的图案变换；ExpandedImage：在面板展开时ImageControlID指定的控件显示的图片；CollapsedImage：在面板隐藏时ImageControlID指定的控件显示的图片；7 ConfirmButtonExtender确认弹出窗口弹出模态面板，相当于JS的Confirm弹出对话框，原页面灰显；配合DisplayModalPopupID使用控件必须包含如下属性：TargetControlID：要控制的控件ID；ConfirmText：弹出的对话框内容；可选属性：DisplayModalPopupID：控制弹出窗口的ModalPopupExtender的ID，联合使用可形成背景灰显效果；8 ModalPopupExtender模态面板，原页面灰显弹出模态面板，配合CSS可使原页面灰显，突出显示模态面板；模态面板以外的控件可点击但不触发事件，可配合使用BackgroundCssClass使背景灰显不可点击；控件必须包含如下属性：TargetControlID：要控制的控件ID；PopupControlID：弹出的面板的ID，一般为Panel的ID;OkControlID：返回OK的面板上的某个控件ID，点击该控件面板返回OK；CancelControlID：返回Canel的面板上的某个控件ID，点击该控件面板返回OK；可选属性：DropShadow：弹出面板是否有阴影；BackgroundCssClass：背景CssClass的类名，使原页面灰显的CssClass 定义如下：.background{background-color:Gray;filter:alpha(opacity=70);opacity:0.7;}9 DragPanelExtender 生成一个可拖动的Panel控件使一个Panel可被拖到页面的任意位置；控件必须包含如下属性：TargetControlID：要控制的可被拖动的控件的ID;DragHandleID：被当作拖动把手的控件ID,鼠标点击上面然后可拖动Panel；最好放到被拖动到Panel里面；在页面任意位置加入如下JS代码，否则Panel拖动后会弹回原来位置：<script type="text/javascript">function setBodyHeightToContentHeight() {document.body.style.height = Math.max(document.documentElement.scrollHeight, document.body.scrollHeight)+"px";}setBodyHeightToContentHeight();$addHandler(window, "resize", setBodyHeightToContentHeight);</script>注：虽然在面板外套上一个div然后指定float,width,height可以时面板不弹回，但不可靠；10 DropDownExtender 使一个Label扩展为DropDownList扩展Label使鼠标放上后形成下拉列表形式，选择一项后等于点击组成该列表项控件，激发该控件的注册事件；控件必须包含如下属性：TargetControlID：要控制的控件的ID;DropDownControlID：备选项的容器ID一般为一个Panel，里面包含多个控件，如LinkButton，Button11 DropShadowExtender 使控件下生成阴影形成立体效果扩展一个控件使控件下生成阴影形成立体效果；一般用于Panel；控件必须包括如下属性：TargetControlID：要控制的控件的ID;可选属性：Rounded：是否使控件角圆滑；True/False ；Radius：控件角的圆滑程度，正整数，数字越大越接近圆形；该属性影响控件的大小；Opacity：阴影透明度，0～1小数，数字越大越不透明；12 DynamicPopulateExtender 生成Html替换掉控件13 FilteredTextBoxExtender 输入文本过滤过滤掉不符合格式的字符，输入不符合格式的字母时界面无显示；控件必须包括如下属性：TargetControlID: 目标TextBox的ID；FilterType：过滤的类型，可选为：Custom，Numbers等；可多选中间用逗号隔开；可选属性：FilterMode：过滤模式，选InvalidChars时，配合属性InvalidChars表示禁止录入这些字符；选V alidChars时，配合属性V alidChars表示只允许这些字符录入；ValidChars：当FilterType为Custom时并且FilterMode为V alidChars允许的字符，例如“×+-/”表示为允许录入上述字符；InvalidChars：当FilterType为Custom时并且FilterMode为InvalidChars禁止录入的字符，例如“×+-/”表示为不允许录入上述字符；14 HoverMenuExtender 扩展GridView鼠标放上显示编辑，删除等菜单无在GridView中，形成鼠标放上显示菜单项，例如显示编辑，删除选项；15 ListSearchExtender List类控件扩展无在List类无合适选项时可手动输入；16 MaskedEditExtender 输入控件格式设置扩展在用户输入时限制输入特定格式字符串，数字或日期；通常配合MaskedEditV alidator控件使用；控件必须包括如下属性：TargetControlID: 目标TextBox的ID；Mask：控件要验证的规则通常用9为占为符，例如“999.999.999.999”；MaskType：验证类型，可为时间，日期，数字等；可选属性：MessageValidatorTip：用户输入时是否提示消息；OnFocusCssClass：控件获得焦点是的CssClass类名；OnInvalidCssClass：未通过验证时的CssClass类名；InputDirection：输入的类型，如：RightToLeft 从右到左，未搞明白干什么的；DisplayMoney：显示钱的符号位置，左或右；不写则为不显示该符号；AcceptNegative：未搞明白干什么的；ErrorTooltipEnabled：未搞明白干什么的；17 MaskedEditValidator输入控件验证扩展，配合MaskedEditExtender使用配合MaskedEditExtender使用，验证用户输入；控件必须包括如下属性：ControlExtender：要扩展的控件ID，一般为一个MaskedEditExtender控件；ControlToValidate：要验证的控件ID;可选属性：AcceptAMPM：未知；IsValidEmpty：是否可为空，true为可为空；默认允许为空；TooltipMessage：输入时鼠标放上时提示信息；MessageValidatorTip: 是否在鼠标放上时显示提示信息；ErrorTooltipEnabled：未通过验证时是否在鼠标放上是显现提示信息；EmptyValueBlurredText：空值时错误信息；EmptyValueMessage：空值鼠标放上提示错误信息；InvalidValueBlurredMessage：验证错误提示信息；InvalidValueMessage：验证失败时鼠标放上提示错误信息；Number：MaximumValue：允许的最大值；MinimumValue：允许的最小值；MaximumValueMessage：超出最大值时鼠标放上提示错误信息；MinimumValueMessage：小于最小值时鼠标放上提示错误信息MaximumValueBlurredMessage：超出最大值时错误信息；MinimumValueBlurredText：小于最小值时错误信息18 MutuallyExclusiveCheckBoxExtender 使用CheckBox实现RadioButtonList的功能使用该控件可以使设置在同一“Key“的多个CheckBox只有一个被选中；控件必须包括如下属性：ControlExtender：要扩展的控件ID；Key：多个CheckBox只有设置为同一个Key值才能保证只有一个被选中；19 NoBot 无20 NumericUpDownExtender 在文本框上添加向上向下小按钮来选择扩展文本框使其可以只能选择指定项或指定的项如图：控件必须包括如下属性：TargetControlID：要扩展的控件ID；Width:文本框宽度；否则文本框宽度为零可选属性：数字可手动输入：Minimum：可选最大值；Maximum：可选最小值；限定选项用户不可输入，如月份时：ValuesRef="January;February;March;April;May;June;July"调用WebService取得项，选中项V alue为WebService方法的返回值：ServiceUpPath：点击向上按钮调用的WebService路径，例如：“NumericUpDown.asmx”；ServiceDownPath：点击向下按钮调用的WebService路径，例如：“NumericUpDown.asmx”；ServiceUpMethod：点击向上按钮调用的WebService方法，例如：“NextValue”；ServiceDownMethod：点击向下按钮调用的WebService方法，例如：“PrevValue”；注：WebService方法签名必须有一个参数，调用时会将当前值传给该方法；可以在文本框添加两个按钮作为向上/向下按钮：TargetButtonDownID：向下按钮的ID；TargetButtonUpID：向上按钮的ID;21 PagingBulletedListExtender 扩展BulletedList使其按指定条件筛选该控件可以从BulletedList项中筛选出符合项的首字母或多个字母的项，并按相似度排序；ClientSort为true,IndexSize为2，Separator为“-”时效果如图：控件必须包括如下属性：TargetControlID：要扩展的控件ID；ClientSort：是否在客户端对生成的筛选条件排序；IndexSize：筛选条件显示几个字母；正整数；Separator：筛选条件的分隔符，例如：“-”；可选属性：SelectIndexCssClass：选择的项CssClass类ID；UnselectIndexCssClass：为选中项的CssClass类ID；22 PasswordStrength 密码强度判断控件必须包括如下属性：TargetControlID：要扩展的控件ID；DisplayPosition：强度提示显示位置，相当于被扩展的文本框；多选一；StrengthIndicatorType：强度提示模式；Text为文本，BarIndicator为进度条；PrefixText：强度提示前缀；例如：PrefixText= “密码强度：”;TextStrengthDescriptions: 密码强度描述；例如：“很弱;弱;一般;强;很强“；可选属性：PreferredPasswordLength：推荐的密码长度；正整数；配合HelpStatusLabelID使用HelpStatusLabelID：指定一个Lable随用户输入显示离推荐长度还差几个字符；StrengthStyles：不同强度时强度提示按不同的样式显示；CssClass类名，中间以逗号隔开；样式和TextStrengthDescriptions一一对应；RequiresUpperAndLowerCaseCharacters：是否验证大小写；MinimumNumericCharacters：至少要包含的数字个数；MinimumSymbolCharacters：至少要包含的符号个数；MinimumUpperCaseCharacters：至少要包含的大写字母个数；HelpHandlePosition：在文本框某个地方出现一个问号标识，点击弹出提示；23 PopupControl 无24 Rating 五个代表等级的星星选择评分生成一列或一排星星，可以点击选中，一般用来评级，或打分控件必须包括如下属性：MaxRating：总共多少个星星；CurrentRating：当前选中多少个星星；可选属性:RatingAlign：星星排列方式，可选水平和垂直；RatingDirection：设置星星从左往右还是从右到左；StarCssClass:开始的样式；例如：.ratingStar{font-size: 0pt; width: 13px; height: 12px;margin: 0px; padding: 0px; cursor: pointer;display: block; background-repeat: no-repeat;}WaitingStarCssClass：等待完成时的样式；例如：.savedRatingStar { background-image: url(Images/SavedStar.png);}FilledStarCssClass：填充时的样式；例如：.filledRatingStar{ background-image: url(Images/FilledStar.png);}EmptyStarCssClass：为选中的星星样式；例如：.emptyRatingStar { background-image: url(Images/EmptyStar.png);}包含事件：OnChanged(): 选中时激发；注：通过在Onload()方法设置Orientation可以；25 ReorderList 生成一个可以鼠标拖动排序的列表；无26 ResizableControl 生成一个可拖动改变大小的控件无27 RoundedCornersExtender 设置控件的边角弧度无28 SliderExtender 扩展TextBox形成一个滑块，可用鼠标拖动效果如图：控件必须包括如下属性：TargetControlID：要扩展的控件ID；Minimum：最小可选值；Maximum：最大可选值；Slider1_BoundControl：显现选择值的控件ID;BehaviorID：和TargetControlID相同；可选属性：Steps：分段的段数，分段后不能微调，只能选指定个特定值；Orientation：排列方式，水平还是垂直；TooltipText：鼠标放上提示；Decimals：默认值；29 SlideShowExtender 扩展Image控件生成幻灯片效果可设置多少秒换图片，向前，向后，播放和停止；控件必须包括如下属性：TargetControlID：要扩展的控件ID；一般为一个Image控件；SlideShowServiceMethod：取得图片的WebService方法；AutoPlay：是否自动播放；ImageTitleLabelID：显示图片标题的控件，一般为一个Label;ImageDescriptionLabelID：显示图片解释的控件，一般为一个Lable;NextButtonID:翻下一页的按钮ID；PreviousButtonID：翻前一页的按钮ID;PlayButtonText：播放键的文本；StopButtonText：停止键的文本；PlayButtonID：播放/停止键的控件ID；Loop：是否循环播放；PlayInterval：自动播放时间隔秒数；服务器端必须包含如下方法：可以写入后台CS页，如果该方法独立到WebService 时需添加属性SlideShowServicePath即WebService路径；[System.Web.Services.WebMethod][System.Web.Script.Services.ScriptMethod]public static AjaxControlToolkit.Slide[] GetSlides(){return new AjaxControlToolkit.Slide[] {new AjaxControlToolkit.Slide("images/Blue hills.jpg", "Blue Hills", "Go Blue"),new AjaxControlToolkit.Slide("images/Sunset.jpg", "Sunset", "Setting sun"),new AjaxControlToolkit.Slide("images/Winter.jpg", "Winter", "Wintery..."),new AjaxControlToolkit.Slide("images/Water lilies.jpg", "Water lillies", "Lillies in the water"),new AjaxControlToolkit.Slide("images/V erticalPicture.jpg", "Sedona", "Portrait style picture")};}30 TabPanel 形成Tab页效果，不多写了31 TextBoxWatermark 在填入前文本框内的提示，获得焦点后隐藏控件必须包括如下属性：TargetControlID：要扩展的控件ID；一般为一个TextBox控件；WatermarkText：水印提示文本；可选属性：WatermarkCssClass：水印的样式；32 ToggleButtonExtender将CheckBox前的小圆点替换成其他图标无33 UpdatePanelAnimation 更新数据时的动画效果34 ValidatorCalloutExtender 验证控件扩展弹出提示框动画如图：控件必须包括如下属性：TargetControlID：要扩展的控件ID；一般为一个验证控件；可选属性：HighlightCssClass：弹出框搜样式。

AjaxControlToolkit控件介绍1.Accordion功能：实现了QQ、Msn好友分类的折叠效果，就像包含了多个CollapsiblePanels细节： (1)不要把Accordion放在Table种同时又把 FadeTransitions 设置为True，这将引起布局混乱(2)每一个 AccordionPane control 有一个Header 和Content的 template(3)在Content中可以进行任意扩展，你什么都可以放上^_^(4)有三种AutoSize modes ：None(推荐) Limit Fill(5)Accordion表现的更像是一个容器2. AlwaysVisibleControl功能：最多的应用是在线小说的目录和不胜其烦的浮动小广告细节： (1)避免控件闪烁，把这个控件要在目标位置时使用absolutely position(2) HorizontalSide="Center" VerticalSide="Top" 使用这个方法控制浮动在什么位置3.Animation功能：28个控件种效果最酷的！顾名思义实现动画效果细节： (1)不只是控件：pluggable, extensible framework(2)用在什么时候：OnLoad OnClick OnMouseOver OnMouseOut OnHoverOver OnHoverOut(3)具体使用有很多可以谈的，有理由单独写一个Animation Xml 编程介绍4.CascadingDropDown功能：DropDownList联动，调用Web Service细节： (1)DropDownList行为扩展(2)如果使用Web service 方法签名必须符合下面的形式：[WebMethod]public CascadingDropDownNameValue[] GetDropDownContents(string knownCategoryValues, string category){...}5.CollapsiblePanel功能：Xp任务栏折叠效果细节： (1)可以扩展任何一个 Panel control(2) CollapsiblePanel 默认认为使用了标准 CSS box model 早期的浏览器要!DOCTYPE 中设置页面为自适应方式提交数据rendered in IE's standards-compliant mode.6.ConfirmButton功能：就是弹出来一个确定对话框7.DragPanel功能：页面拖动细节： (1)TargetControlID 要拖动的控件(2)DragHandleID 拖动的标题栏所在的ControlID8.DropDown功能：什么都可以以下拉菜单的形式弹出来细节： (1)TargetControlID要在什么控件上实现扩展(2)DropDownControlID弹出来什么9.DropShadow功能：阴影效果，其实可以放给美工实现细节： (1)Width 单位：px 默认5px(2)Opacity 不透明度0-1.0 默认.510.DynamicPopulate功能：能实用Web Service或页面方法来替换控件的内容细节： (1)ClearContentsDuringUpdate 替换之前先清除以前的内容（默认True）(2)PopulateTriggerControlID 触发器绑定的控件单击时触发(3)ContextKey传递给Web Service的随机字符串(4) Web Service方法签名必须符合下面的形式：[WebMethod]string DynamicPopulateMethod(string contextKey){...}Note you can replace "DynamicPopulateMethod" with a naming of your choice, but the return type and parameter name and type must exactly match, including case.11.FilteredTextBox功能：文本框数据过滤细节： (1)过滤条件Numbers LowercaseLetters UppercaseLetters Custom(2)过滤条件也可以是Custom的组合 FilterType="Custom, Numbers"(3)ValidChars="+-=/*()." Custom要定义这样的有效字符串12.HoverMenu功能：鼠标靠近时显示菜单，可以用在在线数据修改的表格上作为功能菜单细节： (1)PopupControlID要弹出来什么(2)PopupPostion 在哪里弹出来Left (Default), Right, Top, Bottom, Center.(3)OffsetX/OffsetY 弹出项与源控件的距离(4) PopDelay 弹出延时显示单位milliseconds. Default is 100.13.ModalPopup功能：Xp的关机效果，后面全部灰掉，很多邮箱的删除对话框都着种效果细节： (1)本质上讲这是一个对话框模版，比ConfirmButton有意义有更强的扩展性！(2)从下面的代码中我们发现点OK的时候可以调用后台方法(3)同时可以执行一段脚本14.MutuallyExlcusiveCheckBox功能：互斥复选框就像Radio一样细节： (1)Key属性用来分组就像RdiolistGroup一样(2)argetControlID用来绑定已有的CheckBox15.NoBot功能：Captcha 图灵测试反垃圾信息控件细节： (1)OnGenerateChallengeAndResponse 这个属性是EventHandler<NoBotEventArgs> 调用服务器端的方法，注意方法签名例如： protected void CustomChallengeResponse(object sender, NoBotEventArgs e) {……}16.NumericUpDown功能：实现Winform里面的Updown细节： (1)普通整数增减(2)值列表循环显示比如下面的第二个例子RefValues(3)调用Web Service的格式：17.PagingBulletedList功能：扩展BulletedList的分页功能细节： (1)可以控制每页最多显示多少条，是否排序(2)IndexSize表示index headings 的字符数，如果MaxItemPerPage设置了概属性被忽略(3)MaxItemPerPage分页每页最大条数18.PasswordStrength功能：验证密码强度细节： StrengthIndicatorType两种显示方式：文字提示，进度条提示19.PopupControl功能：任何控件上都可以弹出任何内容细节： (1)TargetControlID - The ID of the control to attach to(2)PopupControlID - The ID of the control to display(3)CommitProperty -属性来标识返回的值(4) CommitScript -把返回结果值通过脚本处理，用到CommitProperty20.Rating功能：级别控件21.ReorderList功能：这个控件的炫酷程度仅次于Animation ，可以动态移动数据细节： (1)绑定数据，拖动数据之后数据将被更新到绑定源(2)它不是已有控件的扩展是全新的服务器端控件，只是它对Ajax行为是敏感的(3)重排的实现有两种方式：CallBack PostBack 前者的发生在页面上是没有PostBack的（也就是没有刷新页面）(4) 而数据添加或者编辑的时候就必须要使用PostBack来同步服务器端的数据状态(5)PostbackOnReorder就是针对两种策略进行选择(6)可以扩展的很多22.ResizableControl功能：就像设计状态一样可以拖动修改大小23.RoundedCorners功能：控件圆角纯粹是控制外观的了，什么时候审美疲劳了还要改，呵呵细节： (1)还有一个非常非常坑人的地方：你必须要设置 CssClass="roundedPanel"要不然不起作用(2) Radius设置弧度，默认是5(3)好象只适用于容器24.Slider功能：实现WinForm中的Slider控件效果细节： (1)修改文本框的值也可以影响Slider的状态！这个反馈还是有用的！25.TextBoxWatermark功能：文本水印26.UpdatePanelAnimation功能：更新动画效果细节：代码结构简单但是要说的东西很多，回头再说写专题吧27.ToggleButton功能：就是把一个CheckBox的逻辑应用到一个按钮上，于是就有了双态按钮这么个玩意，有点意思啊28.ValidatorCallout功能：Windows系统中最常见的气泡提示，比如你磁盘空间不足的时候……细节：是对数据验证控件的扩展，比较新鲜。

1 AccordionContentCssClass是指内容区域的样式名HeaderCssClass是指头部区域的样式名，具体的样式大家自行定义FadeTransitions是指伸缩内容区域时是否播放渐变效果FramesPerSecond是指伸缩内容区域的动画桢数，桢数越大动画就越流畅。

TransitionDuration是指伸缩区域所需要的时间，单位毫秒，时间越大，伸缩区域所需要的时间就越长。

2 AccordionPane 实现多面板，但一次只显示其中一个面板中的内容这个控件大家并不陌生，就是当有多个Panel的时候一次只想显示一个Panel就用这个东西来控制，这个东西的简单的使用我也不一一说了，现在我要是想在这个控件的某个Panel里面加事件怎么做呢？我相信用过这个控件的人都知道这个控件中的Panel也就是AccordionPane控件中的<Head><Content>里面的东西都是不能在界面编辑的，只能在源文件里面编辑，但是现在我要给某个<Content>里面某个按钮加个点击事件怎么办呢？我也没有找到什么好的方法，现在的解决步骤就是先将这个按钮拿在这个AccordionPane控件外面做好这个控件应该做的事情然后再在源代码里头把这个按钮的相关源代码复制到AccordionPane控件的<Content>里头去。

3 AlwaysVisibleControlExtender 不论鼠标怎么滚动，都显示某个内容HorizontalOffset:设置目标控件在水平方向的偏移量，相对于水平边缘方向。

HorizontalSide:设置目标控件的水平边缘的参考方向。

VertialOffset:设置目标控件在垂直方向的偏移量，相对于垂直边缘方向。

VertialSide:设置目标控件的垂直边缘的参考方向。

TargetControlID:目标控件的ID。

ScrollEffectDuration:目前不清楚该属性具体作用，调整了Panel没什么反应。

1.把AjaxControlToolkit.dll和AjaxControlToolkit.pdb拷貝到網站BIN目錄下2.點開工具箱，新建一個標簽：AjaxControlToolkit，（隨意設）3.右擊標簽：AjaxControlToolkit 選擇項目，瀏覽出選擇BIN下的AjaxControlToolkit.dll此時可能報錯，再試一次即可。

此時標簽下已有許多控件出現。

轉到網頁的設計視圖，把工具箱AjaxControlToolkit標簽下的AutoCompeleteExtender拖進網頁（注意一定要設計視圖下，不要在源代碼視圖拖），網頁會自動生成<%@ Register assembly="AjaxControlToolkit"namespace="AjaxControlToolkit" tagprefix="cc1" %>注冊控件4.在生成的<cc1:AutoCompleteExtender ID="AutoCompleteExtender1"runat="server" TargetControlID></cc1:AutoCompleteExtender>裡編輯TargetControlID屬性綁定要做彈出搜索的TextBox的ID5.相關屬性說明：Animations 设置在显示或隐藏弹出面板时要播放的动画。

CompletionInt erval 获取并设置毫秒数，在该时间后，扩展器将使用绑定的Web 服务获取建议。

CompletionList CssClass 指示用于设置完成列表弹出面板的样式的 CSS 类。

CompletionListHighlight edIt emCssClass 指示用于设置完成列表弹出面板中突出显示项的样式的 CSS 类。

第3章Ajax ToolKit的使用 AJAX 工具箱（Control Toolkit）是在微软的倡导下采用”开源”的方式，由各个“社区”（Communities）的开发人员或业余爱好者共同进行开发,并且用最快的速度发布,以便更广泛地发动群众参与,并吸取群众智慧。

目前已经发布的比较成熟的成果四十多个，微软还将不断发布新成果（预计每两个月发布一次）。

这些成果中有的是浏览器端控件，也有的是服务器端控件，有的是对原有控件功能的增强，也有的是独立的新控件。

3.1安装 AJAX Control Toolkit控件为了使用 AJAX 的Ajax Control Toolkit控件，需要下载并安装相关控件，步骤如下：1.下载并解压Toolkit控件选择下列URL: /releases/view/33804下载,并将下载的文件解压到指定的目录中。

[注]：按照上面的url下载原来的版本（Original Ajax Control Toolkit）.请注意,在这里不要下载 Library Beta 0911。

因为这个版本只能适用于VS 2010版。

2.安装Toolkit控件安装的步骤如下：1）先创建一个网站，并打开一张网页；2）右击工具箱，然后在工具箱中建立一个新标签（Add Tag）,例如取名为“Ajax Control Toolkits”；3）右击该标签，选用“选择项目”（Choose Items）,并在打开的对话窗口右下方，通过“浏览按钮”（Browse）,在前面解压的目录中用鼠标双击“AjaxControlToolkit.dll文件”,最后按“确定”按钮，此时在网站的工具箱中将自动增加40多个Toolkit控件。

下面摘要介绍几个常用的Toolkit控件的使用方法。

需要时可以通过以下网站进一步学习其他控件的使用方法：/ajaxtoolkit/3.2 设计Accordion：可折叠面板Accordion是一个独立的控件. 它是英文＂手风琴＂的意思，代表这个控件能像手风琴那样折叠或展开．当一个列表中的项目很多，不便于阅读时，可以将列表项先归类到不同的面板中，并允许随时折叠或展开，阅读起来非常方便．网站中的＂工具箱＂中的控件本身就是用这种方式组织的．3.2.1 Accordion的嵌套结构使用Accordion的关键是，将文档正确地归类并组织成嵌套的结构．１．控件的嵌套结构假定给三个面板进行折叠或展开，其嵌套的代码如下：<form id="form1" runat="server"><div><asp:ScriptManager ID="ScriptManager1" runat="server" /><asp:Accordion ID="Accordion1" runat="server"><Panes><!—第一块面板开始-< asp:AccordionPane ID="AccordionPane1" runat="server"><Header><a href="" onclick="return false">第一页</a></Header><Content><p> 这是第一块面板</p></Content></asp:AccordionPane><!--第二块面板开始→<asp:AccordionPane ID="AccordionPane2" runat="server"><Header><a href="" onclick="return false">第二页</a></Header><Content><p> 这是第二块面板</p></Content></asp:AccordionPane><!--第三块面板开始→<asp:AccordionPane ID="AccordionPane3" runat="server"><Header><a href="" onclick="return false">第三页</a></Header><Content><p> 这是第三块面板</p></Content></asp:AccordionPane></Panes></asp:Accordion></div></form>结果显示如下：代码中需要强调四个问题：１．每个应用Ajax的网页都要首先放入一个ScriptManager控件，其作用主要是当网页打开时将相关的JavaScript代码从服务器送到浏览器，否则控件无法运行．２．各面板的代码都被嵌入到Accordion控件中，每一块面板用AccordionPane控件表示．控件中包括两个字段：<Header></Header>与<Content></Content>前者用于撰写标题；后者撰写实际内容．３．各个面板的Header中用以下代码来实现折叠和展开的操作：<Header><a href="" onclick="return false">第＊页</a>属性标签名描述SelectedIndex 该控件初次加载时展开的AccordionPane面板的索引值HeaderCssClass 该Accordion中包含的所有AccordionPane面板的标题区域所应用的CSS ClassContentCssClass 该Accordion中包含的所有AccordionPane面板的内容区域所应用的CSS ClassAutoSize 在展开具有不同高度的AccordionPane面板时，该Accordion的总高度的变化方式。

AJAX控件使用概述一、 AJAX 控件概述借助 AJAX 控件，使用很少的客户端脚本或不使用客户端脚本就能创建丰富的客户端行为，如在异步回发过程中进行部分页更新（在回发时刷新网页的选定部分，而不是刷新整个网页）和显示更新进度。

异步部分页更新可避免整页回发的开销。

ScriptManager 控件为启用了 AJAX 的 网页管理客户端脚本。

ScriptManagerProxy 控件允许内容页和用户控件等嵌套组件在父元素中已定义了 ScriptManager 控件的情况下将脚本和服务引用添加到网页。

Timer 控件在定义的时间间隔执行回发。

如果将Timer 控件和UpdatePanel 控件结合在一起使用，可以按照定义的间隔启用部分页更新。

您还可以使用 Timer 控件来发布整个网页。

UpdatePanel 控件可用于生成功能丰富、以客户端为中心的Web 应用程序。

通过使用UpdatePanel 控件，可以执行部分页更新。

UpdateProgress 控件提供有关 UpdatePanel 控件中的部分页更新的状态信息。

所有 AJAX 控件都需要web.config 文件中的特定设置才能正常运行。

如果您试图使用这些控件之一，但您的网站不包含所需的 web.config 文件，则网页的“设计”视图中本应显示该控件之处会出现错误。

在“设计”视图中，如果您单击处于该状态的控件，则Microsoft Expression Web 会让您选择要新建一个 web.config 文件还是更新现有的 web.config 文件。

二、ScriptManager 控件ScriptManager 控件为启用了 AJAX 的 网页管理客户端脚本。

默认情况下，ScriptManager 控件会向网页注册Microsoft AJAX Library 的脚本。

这样，客户端脚本就能使用类型系统扩展插件，还能支持部分页呈现和 Web 服务调用之类的功能。

本文由冬_寒季贡献doc文档可能在WAP端浏览体验不佳。

建议您优先选择TXT，或下载源文件到本机查看。

AJAX确实让我没有想到的是 AJAX 居然是在 2007 年才真正走上了历史的舞台, 而且是伴随着一系列的新技术而来.其实,真正让我感叹的不是因为它是一种"新"的技术,而是发展之迅速. 所以,学习 AJAX 是相当有必要的,因为它在微软 Web 开发技术占据着重要的位置: 微软 Web 开发技术: 代码在后端运行,可轻松连接数据库,访问服务器,让用户动态交换数据, 动态产生网页. Silverlight 代码在浏览器端通过 Silverlight Player 运行,可利用 Xaml 代码生成互动的矢量对象和动画,并通过 Javascript 控制 AJAX 在前后端都有代码,可集成前后端的开发技术(Javascript 和 ) ,实现两端之间的非同步通信,数据交换和协作.当然,上面估计是针对 Silverlight1.0 或者 1.1 说的,如今已经发展到 4.0,而且 WPF 似乎也有心往 WEB 插足,而且是相当容易的,因为 Silverlight 本来就是其一个子集. 其实,我还在考虑一个问题,那就是.NET 中的另一个 WCF,似乎与 AJAX"有染" ,估计在未来的发展也不能小觑. 下面开始愉快的学习之旅. 首先介绍由 VS 提供的 AJAX 控件列表: ScriptManager:最常用的一个,而最"没用(不需要你用) "的一个. ScriptManagerProxy:在编写自定义控件的时候使用. Timer:定时回发. UpdatePanel:指定内容为更新区域. UpdaeProgress:显示更新进度条. 显然,只有这几个控件是不能满足我们的要求的,下面介绍AJAX ControlToolkit 中的控件列表: Accordion:折叠菜单目录AlwaysVisibleControlExtender:始终显示的控件-类似悬浮窗口 AnimationExtender:动画效果控件 AutoCompleteExtender:自动完成功能 Calendar:日历控件 CascadingDropDown:级联菜单控件CollapsiblePanel:折叠面板控件ConfirmButtonExtender:确认按钮DragPanelExtender:可拖拽面板 DropDownExtender:下拉菜单 DropShadowExtender:阴影控件 DynamicPopulateExtender:动态填充控件 FilteredTextBoxExtender:过滤控件HoverMenuExtender:菜单控件MaskedEditExtender:编辑验证控件ModalPapupExtender:具有关机效果的弹出式控件 MutuallyExclusiveCheckBoxExtender:互斥复选框控件NoBot:反BOT 控件NumericUpDownExtender:加减数值控件PagingBulletedListExtender:带项目符号的列表控件 PasswordStrength:密码强度提示控件 PopupControlExtender:弹出式控件 Rating:等级控件 ReorderList:可拖拽数据控件ResizableControlExtender:可伸缩控件RounderCornerExtender:锐化边角控件SilderExtender:滑块控件 TabContainer:选项卡控件 TextBoxWatermarkExtender:文本框水印控件 ToggleButtonExtender:个性化按钮控件 UpdatePanelAnimationExtender:局部刷新动画控件 ValidatorCaloutExtender:验证提醒控件事实上 ControlToolkit 当中的控件我只用过 ConfirmButton 和 Calendar 这两个之外, 好像别的都没用过, 这次主要的目的就是熟悉其他控件的使用. 估计有一些控件也没有多大用途, 在以后估计也没什么地方会用到,所以我都不用担心,你还担心什么呢?呵呵,继续,GO!1.AutoComplete 自动完成控件:功能:该控件实现自动提示,相信大家在上网的时候都遇到过在填写 TextBox 内容的时候,会自动提示以前输入过的数据,这个控件就是这样的功能. 属性: 1.TargetControlID:指定要实现提示功能的控件; 2.ServicePath:WebService 的路径, 提取数据的方法是写在一个 WebService 中的; 3.ServeiceMethod:写在 WebService 中的用于提取数据的方法的名字; 4.MinimumPrefixLength:用来设置用户输入多少字母才出现提示效果;pletionSetCount:设置提示数据的行数;pletionInterval:从服务器获取书的时间间隔,单位是毫秒.似乎去 100 很合适呵呵,在使用这个控件的时候,不适用控件之前就有自动提示功能,使用了之后反而没有了,而且添加控件之后会出现一个编译错误.需"Add AutoComplete page method"添加自动完成页的方法.如果采用这种方法,可以在该页的.cs 文件中创建如下代码:[System.Web.Services.WebMethodAttribute(),System.Web.Script.Services.ScriptMet hodAttribute()]//由于要在客户端调用web服务器public static string[] GetCompletionList1(string prefixText, int count, string contextKey){ return default(string[]); }然后,我们就可以使用一个文件来存放要自动提示的字符串,编写代码访问并返回. 当然,一种更常用的方法是单独建立一个Web服务,在里面添加该方法.需在其前面添加[System.Web.Script.Services.ScriptService] 在网上摘录的一个该方法的完整代码如下: [System.Web.Script.Services.ScriptService] public class AutoComplete : System.Web.Services.WebService { public AutoComplete() { //Uncomment the following line if using designed components //InitializeComponent(); } private static string[] autoCompleteWordList = null; 在 [WebMethod]//这里就是提取自动提示字符串的方法, ServeiceMethod中调用public string[] GetCompleteList(string prefixText, int count) { if (autoCompleteWordList == null) { string[] temp = File.ReadAllLines(Server.MapPath("~/App_data/CompleteList.txt"));Array.Sort(temp,new CaseInsensitiveComparer()); autoCompleteWordList = temp; } int index = Array.BinarySearch(autoCompleteWordList,prefixText,new CaseInsensitiveComparer()); if (index < 0) { index = ~index; } int matchingCount; for (matchingCount = 0; matchingCount < count && index + matchingCount < autoCompleteWordList.Length; matchingCount++) { if (!autoCompleteWordList[index + matchingCount].StartsWith(prefixText, StringComparison.CurrentCultureIgnoreCase)) { break; }} string[] returnValue = new string[matchingCount]; if (matchingCount > 0) { Array.Copy(autoCompleteWordList,index,returnValue,0,matchingCount); } return returnValue; }2.FilteredTextBox 过滤控件功能:过滤文本框中指定的内容,用于防止用户输入不合法的字符.属性:1. TargetControlID:被控制文本的 ID2. FilterType:过滤类型,提供 4 中类型.可以使用", "间隔设置多种类型3. ValidChars: FilterType 的属性包含当 "Custom" 时, 此属性有效, 表示有效的字符.3.MaskedEdit 编辑验证控件MaskedEditValidator MaskedEditExtender功能:用来设置文本框显示时的一些格式.属性:1. Mask:类似正则表达式2. MessageValidatorTip:是否提示验证信息3. OnFocusCssClass:当被验证的控件获取焦点时,应用的样式4. OnInvalidCssClass:当被验证的控件验证失败时,应用的样式5. MaskType:验证类型,提供四种:None,Number,Date 和Time6. InputDirection:文本输入方向7. AcceptNegative:是否接受负数的符号"-"8. DisplayMoney:显示金额符号的位置9. PromptCharacter:未输入完时的提示字符. 一般包含两个控件同时使用!另一个参考验证控件.4. PasswordStrength 密码强度提示控件功能:在用户输入密码的时候,密码在文本框后面会有一个提示,说明用户输入密码的强度.属性:DisplayPosition:提示信息显示的位置StrengthIndicatorType:强度提示方式,文本和进度条PreferredPasswordLength:最合适的密码长度PrefixText:提示信息的前缀TextCssClass:提示信息的样式MinimumNumbericCharacters:密码中最少要包含的数字个数MinimumSymbolCharacters:密码中最少要包含的特殊字符个数RequiresUpperAndLowerCaseCharacters:是否要求大小写混合TextStrengthDescriptions:密码强度的提示信息内容,最少 2 个,最多 10 个,排列顺序由弱到强CalculationWeightings:4 种类型的衡量标准BarBorderCssClass:提示进度条样式HelpStatusLabelID:帮助信息 IDHelpHandPosition:帮助信息的位置5. TextBoxWatermark 文本水印控件功能:当文本中没有数据时,可以使用非常特殊的样式填充在文本框中,当用户开始输入内容时, 这些特色样式自然消失. 当用户没有输入内容, 文本框失去焦点后, 又出现该样式.属性:WatermarkText:水印效果提示的文本WatermarkCssClass:水印效果应用的样式6. ValidatorCallout 验证提醒控件功能:验证未通过时,弹出一个类似模式对话框的小窗口,提醒用户发生的错误. 更加醒目的验证方式!属性:Width:弹出式信息的宽度WarmingIconImageUrl:弹出信息中的经过图片地址CloseImageUrl:弹出信息中使用的关闭图片地址7. HoverMenu 菜单控件功能:使一些菜单该出现时才出现,当鼠标移动到指定地点时不会影响其他元素属性:PopupControlID:作为弹出式菜单的控件 IDHoverCssClass:鼠标滑过时的样式PopupPosition:弹出式菜单坐在的位置OffsetX:菜单举例目标控件的位置--横坐标OffsetY:纵坐标PopDelay:弹出菜单的延迟时间实例: 实例:HoverMenu 控件可实现简单的弹出菜单效果参考网站:/zh-cn/dd553520.aspx用 Repeater 控件从数据库中取出数据,在 ItemTemplate 模板中使用 PopupControl 控件,PopupControlID 指向一个弹出式菜单面板,这个弹出式面板我由Panel 改为HyperLink. 这里出现一个小问题, 就是鼠标放在弹出式面板上, 弹出式面板会跳动, 不是呆在鼠标指定的那个地方.8. PopupControl 弹出式控件功能:弹出任意类型的控件,不管是服务器控件还是 Html 控件属性:弹出式菜单属性均相似,见上.9. Accordion(手风琴)折叠菜单目录功能:将一组功能相似,任务相同的内容放在不同的选项卡中,然后通过选项卡的 Header 实现各组内容的查看.我们可以逐一地编写 Accordion 中的 AccordionPane 控件, 每个 AccordionPane 控件即代表一个可折叠的面板. 还可以使用数据绑定的方式, 分别为其指定标题和内容区域的绑定模板以及数据源,让 中的数据绑定为我们自动生成其中的若干个折叠面板. Accordion 还能够把当前正处于展开状态的面板自动记录下来, 并在页面回送之后恢复其提交前的样式. 属性:SelectedIndex:在 Accordion 中设计的多个 Pane,此属性用来判断当前选择的是哪个PaneHeaderCssClass: AutoSize: 设计Accordion 中Pane 的显示方式, 主要有 3 种:None, Limit 和 Fill; None 可以无限制收缩,Limit 限制内容的高度,超出部分出现滚动条,Fill 表示和设置的高度一致,超出部分不会显示.FadeTransitions:是否使用透明样式的褪色特效TransitionDuration:特效时间间隔,单位为毫秒FramesPerSecond:帧/秒,折叠特效的速度Panes:是 Accordition 内容所在,其包装必须是"AccordionPane"控件,可以是多个Panes 和AccordionPane 表声明Accordion 控件时的常用属性标签属性标签名SelectedIndex HeaderCssClass ContentCssClass AutoSize 描述该控件初次加载时展开的 AccordionPane 面板的索引值该 Accordion 中包含的所有AccordionPane 面板的标题区域所应用的CSS Class 该Accordion 中包含的所有AccordionPane 面板的内容区域所应用的CSS Class 在展开具有不同高度的AccordionPane 面板时, Accordion 的该总高度的变化方式.可选如下 3 个值: r None:该 Accordion 将随着当前展开的 AccordionPane 面板的高度自由伸长/缩短 r Limit:该Accordion 将随着当前展开的 AccordionPane 面板的高度自由伸长/缩短,不过最高不会超过 Accordion 的Height 属性设定值.若是其内容高度超过了 Height 属性设定值,则将自动显示滚动条r Fill:该 Accordion 的高度将固定为 Height 属性的设定值, 不随当前展开的不同高度的AccordionPane 面板而变化.若是某个 AccordionPane 的内容高度超过了 Height 属性设定值, 则将自动显示滚动条 FadeTransitions TransitionDurati on FramesPerSecond DataSourceID<ContentTemplate > 若该属性值设置为 true,则在切换当前展开的 AccordionPane 面板时,将带有淡入淡出效果展开/折叠一个 AccordionPane 面板的过程所花费的时间,单位为毫秒播放展开/折叠 AccordionPane 面板动画的每秒钟帧数页面中某个 DataSource 控件的 ID,用于通过数据绑定自动生成 AccordionPane 面板该标签内将包含一系列的标签, 即 Accordion- Pane 的声明,用来表示 Accordion 中包含的面板在使用数据绑定功能自动生成 AccordionPane 面板时, 该标签内将定义每个面板的标题区域中的内容模板在使用数据绑定功能自动生成 AccordionPane 面板时, 该标签内将定义每个面板的正文区域中的内容模板需要注意的是 FadeTransitions 和 FramesPerSecond 属性.自然,将 FadeTransitions 设置为 true 将让面板展开/折叠的过程显得非常酷, 且将 FramesPerSecond 属性值设置得比较高也会让展开/折叠的动画变得更加平滑, 但这样也同时会加重客户端程序执行时的负担, 我们应该综合考虑各种情况合理地配置这两个属性. 一般来讲, 若是 Accordion 的大小适中, 且其中也没有太多的 AccordionPane 面板,那么可以将 FadeTransitions 设置为true(即显示淡入淡出效果),并将 FramesPerSecond 设置为 40(即每秒 40 帧)左右,让动画效果更加流畅眩目.而若是对于较大的,甚至全屏的 Accordion,或是其中包含了许多个复杂的AccordionPane 面板, 那么就应该将FadeTransitions 设置为false, 且将FramesPer Second 设置为 25 左右,尽可能地避免对客户端执行效率产生过多的影响. 与DataSourceID 属性相关的还有 DataSource 和 DataMember 属性,分别表示将绑定到该控件上的数据源(一般在代码中设置)和DataSource 中数据成员的名称. DataSourceID,DataSource 和 DataMember 属性是 中每一个支持模板化数据绑定的控件都包含的.DropDown 下拉菜单控件功能:为任意控件指定下拉菜单,这个下拉菜单必须存在.属性:略为按钮等控件执行下拉列表实现快速选择.10.CollapsiblePanel 折叠面板控件功能:折叠面板就是实现一个 Panel 的显示和隐藏,可以定义 Panel 的样式. 属性:CollapsedSize:折叠后的尺寸ExpandedSize:伸展后的尺寸 Collapsed:默认打开页面时,Panel 是否处于折叠状态ScrollContents:是否在 Panel 中显示滚动条ExpandDirection:伸展方向,水平或垂直CollapseControlID/ExpandControlID:该属性指定控制折叠/扩展的控件ID.d)TextLabelID:指定一个控件,可以在扩展或折叠Panel 时显示CollapsedText/ExpandedText 中的内容. CollapasedText/ExpandedText:Panel 折叠/扩展时的文本. Collapsed:指定页面导入时 Panel 是折叠还是扩展. ImageControlID:指定一个控件,在扩展时显示 ExpandedImage 中的图像;在折叠时显示 CollapsedImage 中的图像. ExpandedImage/CollapsedImage:在扩展/折叠时显示不同的图像. SuppressPostBack:禁止回传. 将 Panel 中的内容显示或隐藏. 使用两个 Panel, 一个 Panel 用于扩展控件的 ID, 另一个用于折叠控件的 ID.11.DragPanel 可拖曳面板控件功能:这是一个简单的 Ajax 控件,不支持拖拽前和拖拽后的事件操作属性:DragHandleID:实现拖拽的控件,即当拖拽DragHandleID 时,实际上移动的是TargetControlID这个控件最好配合样式表使用.12.Tabs 选项卡控件功能:在 C/S 中,有各种选项卡控件,B/S 中没有,要在一个页面显示多组内容, 可以通过 CSS 样式来显示和隐藏以达到选项卡的效果.属性:OnClientActiveTabChanged:单击选项卡标题时触发的事件ActiveTabIndex:默认显示的选项卡ScrollBars:是否显示滚动条这个控件非常棒哦!13.Animation 动画控件功能:显示小动画属性:OnLoad:页面加载时触发OnClick:单击控件时触发onMouseOver:鼠标滑过时触发OnMouseOut:鼠标移走时触发 OnHoverOver:与 OnMouseOver 类似OnHoverOut:与 OnMouseOut 类似"Fade Animation"的属性主要有 4 个: l duration:动画效果的时间间隔. l Fps:帧/秒的显示速度. l maximumOpacity:最大透明度. l minimumOpacity:最小透明度. 假如学习了 WPF 或者 Silverlight 的话,使用 Expression Blend 制作的时间帧动画,就很容易理解了.说明一下:似乎 AJAX 的这些控件,和 WPF 已经在接近了,但还是相差甚远哈,有这种趋势而已.14.DropShadow 阴影控件功能:实现阴影属性:Opacity:透明度,最大值为 1,不透明,默认值为 0.5Rounded:是否锐化目标控件边角TrackPosition:追随目标控件的位置,此属性一般应用在控件被拖动的时候15.RounderCorners 锐化边角控件功能:该控件同样其锐化作用,缺点是没有阴影效果,有点事可以锐化 4 个边角的任意一个或多个.属性:Radius:锐化幅度Corners:锐化的边角,All 表示所有边角16.ToggleButton 个性化按钮控件功能: 该控件只能应用于 CheckBox, 主要功能是以自定义图片的形式显示复选框的选中和未选中状态.属性:CheckedImageAlternateText:选中状态下的提示文本UnCheckedImageAltenateText:未选中状态下的提示文本UncheckedImageUrl:未选中状态下显示图片地址CheckedImageUrl:选中状态下显示的图片地址DisabledCheckedImageUrl:控件为不可用状态时,默认时要显示的图片17.UpdatePanelAnimation 局部刷新动画控件功能:该控件用来装饰 UpdatePanel 更新的效果,提供对 UpdatePanel 更新时和更新后的特效,并允许用户自定义这些特效.Animation 控件不仅仅是一个控件 ,它是一个可向控件添加动画的框架.属性:OnUpdating:更新时应用的特效OnUpdated:更新后应用的特效18.AlwaysVisibleControl 始终显示控件功能:创建一个始终显示的内容,通常用来显示菜单,消息和广告等.属性:VerticalSide:显示控件时垂直位置,上中下VerticalOffset:显示控件时与最上方的距离,相对坐标HorizontalSide:显示控件的水平位置:左中右HorizontalOffset:显示控件与最左侧的距离,相对坐标 ScrollEffectDuration:当滚动条滚动时,显示控件的显示延迟,默认时 0.1 秒ProfileBindings:要绑定的个性化配置的属性19.Calendar 日历控件功能:可以选择到文本框中的日历控件属性:Format:日历显示的日期格式PopupButtonID:当日期是通过选择某个按钮弹出的时候可以使用 PopupButtonID 指向一幅图片,放在文本框后面,点击图片就可以弹出日历控件选择日期.呵呵,由于是测试,放置了一幅大的图片.20.CascadingDropDown 级联下拉列表控件功能:级联菜单,当第一级可用时,第二级可用,第二级可用时,第三级不可用, 依次类推. Category:当前下拉框的类别PromptText:当下拉框无数据和未选中数据时,给用户提示. 在使用此控件的时候,由于涉及到数据库,故按提交按钮需验证,如果将EnableEventValidation="false",也就是不验证可以解决这个问题,但是这样就不安全了.这一点需要注意. Category需要同从数据库中取出数据类别相同,这里是Xml数据,也就是要对应节点,在此WEB服务中的Hierarchy即存储相应类别和节点.21.Confirm 确认按钮控件主要属性设置时ConfirmText,即显示弹出消息框的内容.22.DynamicPopulate 动态填充控件允许程序在运行的过程中,更改指定控件的内容,类似于"document.getElementById("ControlID").value="Selected Control""语句.这个控件是利用 createElement 和 appendChild 等 DOM 方法实现的.属性:BehaviorID:行为 ID,用于在客户端获取 Ajax 控件TargetControlID:需要动态填充的内容控件ClearContentsDuringUpdate:在更新时是否情况内容 ServicePath:获取数据需要使用的 Web 服务ServiceMethod:获取数据的方法UpdatingCssClass:更新过程中使用的样式ContextKey:上下文关键字,通过此关键字,判断返回的数据类型CustomScript:一段自定义的脚本,必须为能被格式化的字符串PopulateTriggerControlID:引发填充事件的控件23.ModalPopup 具有关机效果的弹出式控件该弹出式控件最大的特色就是具备"模式"窗口风格,在 B/S 应用中,使用这样风格的好处是,当用户选择这个设置时,其他内容都会受到保护.使用这种方法,处理弹出窗口中的事件是一件很繁琐的事情,由于不能直接在弹出控件中添加服务器端方法,因为添加了也没有反应,估计要想实现事件需在客户端使用Javascript 来完成.在 DynamicPopulateExtender.aspx 实例中可以看出.24.MutuallyExclusiveCheckBox 互斥复选框控件功能:复选框实现多个项目选择,但是项目之间可以含有互斥项.含有相同 Key 的为同一组,同一组之间是互斥的,但与不同 Key 之间的组,是可以同时选择的.属性:TargetID:被控制的复选框.Key:区分互斥复选框的键值.同时使用多个 BulletedList 控件也可以实现此功能!25.NoBot 反 Bot 控件功能:防止自动提交程序的运行.属性:OnGenerateChallengeAndResponse:自定义的相应事件,用于反 BOTResponseMinimumDelaySeconds:响应的最小延迟,单位为秒26.NumbericUpDown 加减数值控件功能:为一个文本框添加上下按钮,当单击这个按钮时,可以实现数字的加减,同时也可以提供静态数据,实现数据的上下选择.属性:Width:TextBox 显示时的宽度,默认为 0,不显示目标 TextBoxRefValues:进行上下操作的一些静态值TargetButtonDownID:进行"下"操作的按钮TargetButtonUpID:进行"上"操作的按钮在.cs 页面中直接使用 Page Method,不是在单独的 asmx 文件中使用: 注释掉会[System.Web.Services.WebMethod](自己添加) 或者[System.Web.Services.WebMethodAttribute(), System.Web.Script.Services.ScriptMethodAttribute()](自动生成)会弹出错误框.还需要注意方法中的参数的数据类型.27.PagingBulletedList 带项目符号的列表控件功能:显示一些列表项,主要的扩展对象是 BulletedList 控件.属性:ClientSort:是否在客户端进行排序IndexSize:标题索引的字符个数Separator:标题索引的间隔符将相同列表开始的 IndexSize 个字符作为标题,点击之后展开所有以此标题为首的列表项.在使用服务器端代码来改变 IndexSize 的值时,使用 TextBox 时需添加 AutoPostBack 属性,但是这样会出现频繁刷新的问题.如果使用 UpdatePanel 来实现呢,使用触发的时候,也会遇到根本不访问服务器端代码的问题.这种的方案是:使用一个 Button 控件在UpdatePanel 中触发,注意触发方式采用PostBackTrigger,不要采用异步触发AsyncPostBackTriger(注意,Button 控件本来就会导致会发,所以在 UpdatePanel 中也没有必要添加触发器的,说得更狠一点,就是不需要 UpdatePanel 也可以,我使用触发器,不过是为了熟悉它而已.呵呵,但是这样实现的就不是使用局部刷新了.. ).所以,最佳解决方案,还是在客户端用 Javascript 来实现.28.Rating 显示等级控件功能:显示等级信息,可以以图片的形式显示. 属性:CurrentRating - 所使用的初始评分 MaxRating - 最高评分 EmptyStarCssClass - 评分项("星号")为空时使用的 CSS 类 FilledStarCssClass - 评分项("星号")已填写时使用的 CSS 类 StarCssClass - 为一个 visible stat 使用的 CSS 类 WaitingStarCssClass - 将星级评分发送回服务器时使用的 CSS 类 AutoPostBack :当单击"评级"这个控件时,是否回送.默认不回送. OnChanged :在完成评级之后,触发"客户端回调"事件以便执行某一段程序代码.准备两种图像,一种用于显示填写过的评分项,另一种显示空白评分项29.ReorderList 可拖曳数据控件功能: ReorderList 控件用来显示数据, 其功能相当于GridView, DataList 和Repeater 等,都可以绑定数据,并支持各种模板.ReorderList 的优势在于,其允许用户自定义行的显示,即用户可以拖行到任意位置,同时还支持客户端的排序,这样可以减少回调,提高性能.ReorderList 控件时的常用属性标签属性标签名 DataSourceID DataKeyField 描述页面中某个 DataSource 控件的 ID, 用于通过数据绑定自动生成列表项目数据源中键字段的名称,该字段中的值应该在所在记录中是唯一且不变的,ReorderList 将用条目中该字段的值作为记录的标志,将在更新/删除中使用是否允许用户对列表中的项目进行重新排序,若指定了<ReorderTemplate>,则该属性将自动设置为 true 数据源中作为排序字段的名称.在用户进行重新排序之后,ReorderList 将自动修改需要更新的条目的该字段条目的可拖动区域与条目之间的相对位置关系,可选 Top(上部),Bottom(下部),Left(左边)和Right(右边) 若该属性值设置为 true,则当用户对列表中的项目进行重新排序之后,将自动引发一次整页的回送;否则将以异步回调的方式向服务器端发送请求列表中当前处于编辑模式下的项目的索引值若该属性值为 true,则列表中将显示出一个用来添加新条目的特殊行,即模板中定义的内容插入的新行在整个列表中的位置,可选 Beginning (第一项)或End(最后一项) 该标签内将定义列表中普通条目的模板该标签内将定义列表条目中可拖放区域的模板.用户只有在该区域中拖放才能够对该条目进行重排序该标签内将定义拖动列表条目时列表中可投放区域AllowReorderSortOrderFieldDragHandleAlignmen t PostBackOnReorderEditItemIndex ShowInsertItemItemInsertLocation <DragHandleTemplat e> <ReorderTemplate>的模板 <EditItemTemplate>该标签内将定义用来添加新条目的特殊行的模板该标签内将定义处于编辑状态中的列表条目的模板该标签内将定义空列表的模板.若列表中没有任何条目,则将显示该模板中定义的内容对于 PostBackOnReorder 属性,若该 ReorderList 控件将只提供对项目重新排序的功能,则应该将其设置为 false,这样可以充分利用 ReorderList 自带的异步回调功能.若是该ReorderList 控件同样支持对条目的添加,删除,编辑等复杂功能,则应该将PostBackOn- Reorder 属性设置为 true,并用 UpdatePane l 包围该 ReorderList,以期得到Ajax 的异步回送功能.使用这个真难拖动,真是太难了!这让我想起了 WebParts,可惜我原本打算在那上面花点功夫的,但是没有,真是遗憾.好不容易实现了拖动吧,费了好大劲都不能拖动一次, 只有当你自己做练习的时候才知道,估计这个以后不怎么使用.30.ResizableControl 可伸缩控件功能:该控件可以改变其他控件的高度和宽度.属性:HandleCssClass:在控件中支持改变的位置所使用的样式ResizableCssClass:改变控件大小时应用的样式MinmumWidth/MaxmumWidth/MaxmumHeight/MinmumHeight:允许控件伸缩的最小,最大宽度和高度OnClientResize:控件伸缩后,客户端触发的事件 HandleOffsetX/HandleOffsetY:在控件中支持改变的位置(X/Y 位置) ,一般是控件的右下角相对坐标这个控件实现的是伸缩,不是放大和缩小.也就是只能看见你整个图片的局部,你可以拖动使得像窗口那样改变窗口大小来查看内容,注意内容大小时没有改变的.31.Slider 滑块控件功能:该控件可以个性化地显示当前的数字值,用户还可以通过文本框,控制滑块的数据值.属性:TargetControlID:该控件的目标控件,即其要扩展的控件. BoundControlID:当改变值时,显示数据的控件. EnableHandleAnimation:当改变值时滑块是否有动画效果.值为 True, 则有 Animation 效果;值为 False,则没有 Animation 效果. RaiseChangeOnlyOnMouseUp: 设定是否只有在鼠标离开的时候才触发事件.值为 True,则是;否则,不是.总结:由于 AJAX(Asynchronous JavaScript and XML)技术是基于 JavaScript 和 XML,实现的是同客户端的交互让用户没有感觉(呵呵,自己这么理解的,其实有感觉)所以,一些代码虽然可以在服务器端处理,但是更好的方式是在客户端使用 JavaScript 来处理.至于 XML,我觉得可以不讲其单纯的理解为 XML 数据,而就是数据.从整理的 AJAX 控件就可以看出来,有好多个控件可以通过 Web Service 同服务器端通信,实现数据的交换. 还有一点需要注意的是:在同一页面使用过多的 AJAX 控件,会导致性能下降,迫使浏览器弹出对话框: 不论怎样,关于 AJAX 控件的使用,总算整理完了.虽然,有的很粗糙,而且更多的我都是从我的角度来理解整理的,很多都是从网上查找整理出来的,代码都是参照别人的代码,亲自实现了的.。

Coolite Toolkit学习笔记一：AjaxEvent、AjaxMethod 和Listeners一：AjaxEventCoolite Toolkit所提供的AjaxEvent可以应用在很多的控件中，实现异步提交等相关功能。

比如使用在Coolite Toolkit的Button控件中，通过该控件提供的机制就可以方便的使用。

1 <script runat="server" language="C#">2protected void OnAjaxEvent_Click(object sender, AjaxEventArgs e)3 {45 }6 </script>7 <ext:Button ID="Button1" runat="server" Text="Submit">8 <AjaxEvents>9 <Click OnEvent="OnAjaxEvent_Click"></Click>10 </AjaxEvents>11 </ext:Button>如果需要使用在标准控件或是其他的html标签元素上，则需要通过Coolite Toolkit所提供的ScriptManager来实现了，下面简单演示将AjaxEvent使用在官方的Button控件上。

<ext:ScriptManager ID="ScriptManager1" runat="server"><CustomAjaxEvents><ext:AjaxEvent Target="myButton" OnEvent="OnAjaxEvent_Click"><EventMask ShowMask="true" MinDelay="500" Msg="正在处理" /></ext:AjaxEvent></CustomAjaxEvents></ext:ScriptManager><script runat="server" language="C#">protected void OnAjaxEvent_Click(object sender, AjaxEventArgs e){}</script><asp:Button ID="myButton" runat="server" Text="点我" />通过上面这种方式，可以把AjaxEvent添加到任何的html元素上（比如：input,div,p,span等等）。