AjaxControlToolkit控件简要介绍

合集下载

ASP.NET AJAX入门系列：Timer控件简单使用

AJAX入门系列：Timer控件简单使用本文主要通过一个简单示例，让Web页面在一定的时间间隔内局部刷新，来学习一下 AJAX中的服务端Timer控件的简单使用。

主要内容Timer控件的简单使用1．添加新页面并切换到设计视图。

2．如果页面没有包含ScriptManager控件，在工具箱的AJAX Extensions标签下双击ScriptManager控件添加到页面中。

3．单击ScriptManager控件并双击UpdatePanel控件添加到页面中。

4．在UpdatePanel控件内单击并双击Timer控件添加到UpdatePanel中。

Timer控件可以作为UpdatePanel的触发器不管是否在UpdatePanel中。

5．设置Interval属性为10000。

Interval属性的单位是毫秒，所以我们设置为10000，相当于10秒钟刷新一次。

6．在UpdatePanel控件中添加一个Label控件。

7．设置Label控件的Text属性为“Panel not refreshed yet ”。

确保Label控件添加在了UpdatePanel控件里面。

8．在UpdatePanel之外再添加一个Label控件。

确保第二个Label控件在UpdatePanel的外面。

9．双击Timer控件添加Tick事件处理，在事件处理中设置Label1的Text属性为当前时间。

protected void Timer1_Tick(object sender, EventArgs e){Label1.Text = "Panel refreshed at: " +DateTime.Now.ToLongTimeString();}10．在Page_Load事件中添加代码设置Label2的Text属性为页面创建时间，如下代码所示：protected void Page_Load(object sender, EventArgs e){Label2.Text = "Page created at: " +DateTime.Now.ToLongTimeString();}11．切换到代码视图，确保代码如下所示：protected void Page_Load(object sender, EventArgs e){Label2.Text = "Page created at: " +DateTime.Now.ToLongTimeString();}protected void Timer1_Tick(object sender, EventArgs e){Label1.Text = "Panel refreshed at: " +DateTime.Now.ToLongTimeString();}12．保存并按Ctrl + F5运行13．等待10秒钟后可以看到Panel刷新，里面的Label文字改变为刷新的时间而外面的Label没有改变。

AjaxControlToolkit使用整理

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：弹出框搜样式。

Ajax扩展控件详解

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没什么反应。

AJAX Control Toolkit功能篇

1-5
AutoComplete控件
服务文件中的类与方法类上需要添加一些内容
这个需要手动增加
1-6
AutoComplete控件
类里的方法定义
方法名称就是AutoComplete控件的 ServiceMethod属性设置值
表示与数据绑定控件结合使用的 Microsoft Access 数据库。
1-7
1-19
DragPanel控件
常用属性
• TargetControlID属性：要被设置为可拖曳的属性：属性要被设置为可拖曳的Panel控件控件
名称
• DragHandleID属性：要提供拖曳控制属性：控件，属性要提供拖曳控制Panel控件，也就控件
是当用户在此Panel控件上单击鼠标左键进行拖曳动作控件上单击鼠标左键进行拖曳动作是当用户在此属性指定的Panel控件就会移动，控件就会移动，时，TargetControlID属性指定的属性指定的控件就会移动但注意，此时DragHandleID属性指定的属性指定的Panel控件并不但注意，此时属性指定的控件并不会移动。会移动。
1-16
ConfirmButton控件
属性
• TargetControlID属性：要使用属性：属性要使用ConfirmButton控件来控件来
显示确认窗口的Button控件的名称。控件的名称。显示确认窗口的控件的名称
• ConfirmText属性：显示在确认窗口中的提示文字属性：属性
第二层的格式
1-14
CascadingDropDown控件
网页例子
第一层DropDownList控件
第二层DropDownList控件

Ajax的两种基本开发模式

Ajax的两种基本开发模式引言最近花了一些时间，将微软官方的Ajax 视频全部看了一遍，地址是/learn/ajax-videos/，视频大多都很短，8至15分钟的居多，有讲述AjaxControlToolkit中控件用法的，也有讲述 Ajax常见的应用场景和技巧的。

本文介绍了使用 Ajax做开发时两种最常见的与服务端进行交互（客户端请求服务端执行逻辑，服务端返回结果）的开发模式。

第一种我姑且称为UpdatePanel模式，第二种称为Web Service（WCF Service）模式。

开始前的一些准备对于这些文章，我假设大家都已经安装好了 Ajax Extension 和 Ajax Control ToolKit 这两个组件。

其中 Ajax Extension 已经包含在了.Net Framework 3.5中，而Ajax Control Toolkit可以去这个位置下载：/AjaxControlToolkit/Rel ease/ProjectReleases.aspx?ReleaseId=16488。

因为我使用的是VS2008，所以Ajax Extension无需安装，而Ajax Control Toolkit我安装到了GAC（GlobalAssembly Cache，全局程序集缓存）中，因此文章所附代码的Bin目录不会包含任何的dll组件。

如果你想运行代码，可以像我一样将Ajax Control Toolkit 安装到GAC中，或者针对自己的情况（VS2005或者VS2008，私有程序集部署还是GAC部署）对代码进行一些简单的修改和配置。

如果你想安装到GAC中，假设你将AjaxControlToolkit.dll拷贝到了“C:\”下，那么可以打开“VS2008命令提示符”，然后输入下面的命令，按回车：gacutil -i C:\AjaxControlToolkit.dll除此以外，还有两点需想要说明。

用AJAXControlToolkit做弹出搜索框(类似百度)

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 的使用

第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的总高度的变化方式。

asp.net中AJAX技术基础及应用

19
更灵活的更新方式
当把UpdatePanel的ChildrenAsTriggers属性设置为false时,它内部所有的控件引发的异步回送都不会更新自已.如果同时它的 UpdateMode=Conditional,那么,必须指定外部某个控件来触发它的异步更新,否则,它无法实现异步更新自己. 这个"外部"的控件被称为"触发器(Trigger)". 触发器( 触发器 Trigger) 所谓"触发器",其实就是可引发异步更新的控件.
1. 2. 3.
4.
5.
36
示例的要点
使用验证控件验证数据有效性.注意要让其 EnableClientScript="False". 注意复习GridView分页的方法. 编程显示弹出窗口: ModalPopupExtender1.Show(); 要让弹出窗口支持拖动,需给<strong>元素加上id 和runat="server"标记,配上样式表,然后指定 ModalPopup控件的PopupDragHandlerControlID 属性.
程序设计之程序设计
AJAX技术初阶 AJAX技术初阶
主要内容
AJAX概述页面的局部刷新与异步回发使用UpdateProgress控件定时调用 AJAX Control ToolKit ToolKit简介及应用
2
1 AJAX概述
Web应用程序的"软肋"
问:让网页象EXCEL一样好用,可能吗? 答:Web应用与桌面应用有着完全不同的运行环境和编程模型,在目前的技术条件下,Web应用要完全超越已发展多年的桌面应用所拥有的丰富交互特性,还是很困难的. 问:为何访问网页很慢,并且在显示时会有闪烁? 答:当前网络带宽还不够,并且传统的Web网页是采用"请求"-"刷新"这一机制来显示的,并且哪怕数据只有一点改变,也得刷新整个页面…… 正是为了弥补传统Web技术的弱点,AJAX技术才得到广泛应用.

(实现类似GOOGLE搜索框的自动提示功能+)AJAXTOOLKITAUTOCOMPLETEEXTENDER+用法详解

2. AutoCompleteExtender 的效果(功能)
如下图所示, 当在文本框中录入1 时, 所有包括1 的串都被显示出来, 当录入123 的时候, 包括123 的串被显示出来, 在这个下拉列表中单击选中某一项, 则文本框的值改变为选中的项的值. (当选中某项时需要触发事件, 或想使用键值对的话, 请参阅我的另一篇文章ajaxToolkit:AutoCompleteExtender 的触发选择事件以及JSON序列化和使用键值对. 值得注意的是: 下拉列表中的项与文本框中录入的内容的关联的规则是自己定义的, 例如, 示例图中, 录入1时, 凡是包括1的串都被显示了出来, 无论1 在这个串的什么位置都可以, 但是可能你希望只显示以1 开头的串, 你只需要修改一下服务方法的实现即可, 稍eteExtender
既然名为Extender, 就说明它是一个扩展控件, 它必须依赖于别人而存在-----这个别人指的是文本框. 所以,
首先要有一个宿主文本框:
<asp:TextBox ID=&uot;txt1&uot; runat=&uot;server&uot;></asp:Tex
指令即可. 例如, 我的示例页面的指令:
<%@ Register Assembly=&uot;AjaxControlToolkit&uot; Namespace=&uot;AjaxControlToolkit&uot;
TagPrefix=&uot;ajaxToolkit&uot; %>
并不多, 于是我有了充分的理由再写一篇关于这个控件的详细介绍.

ASP.NETAJAX控件使用概述

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 服务调用之类的功能。

JSP Ajax Prototype框架简介

JSP Ajax Prototype框架简介Prototype框架是一个基于客户端的Ajax框架，其实质就是将客户端常用的Aj ax代码，如创建XMLHttpRequest对象这些重复性代码，使用面向对象的方式进行封装，封装成一个js文件。

Prototype框架使用过程，只需要调用相应的对象，而不必关系其具体的实现细节。

从这方面说，Prototype是一个基础的JavaScript应用框架，Prototype的目的是为了更方便的开发JavaScript的应用，使用它可以更加方便简单的使用JavaScript 编程，开发面向对象的JavaScript程序，Prototype框架是JavaScript代码的自然扩展，更容易被人接受。

但是，Prototype是最受欢迎的AJAX框架之一。

比较著名的网站2006年的调查结果显示，Prototype同框架规模庞大的Yahoo! User Interface，Goog le Web Toolkit，and Atlas.等相比较起来，其排名竟然遥遥领先，这不能不令人感到惊异。

答案很简单：Prototype使用起来就像是对于JavaScript语言的自然扩展。

尝试过Prototype框架后，笔者几乎坚信Prototype框架应该被纳入JavaScript语言。

Prototype中包含了一个功能强大好用的Ajax框架，Prototype是一个基础性的框架，很多更高层次的框架都以它为基础，例如scriptaculous效果库。

Prototype框架以面向对象的方式封装JavaScript代码，其封装文件为prototype. js。

使用prototype.js可以大大简化客户端代码的开发工作。

prototype.js引入了类的概念，用其编写的类可以定义一个initialize的初始化函数，在创建类实例的时候会首先调用这个初始化函数。

正如其名字，prototype.js的核心还是prototype，虽然提供了很多可复用的代码，但没有从根本上解决JavaScript的开发和维护问题。

AJAX控件整理(完整版)

本文由冬_寒季贡献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 控件的使用,总算整理完了.虽然,有的很粗糙,而且更多的我都是从我的角度来理解整理的,很多都是从网上查找整理出来的,代码都是参照别人的代码,亲自实现了的.。

AJAX第4章Control_Toolkit功能篇共26页

PasswordStrength控件
PasswordStrength控件能够在用户创建密码时立刻检查密码的强度，提供用户创建不易被破解的密码。
PasswordStrength控件的功能非常强大，提供了近20 项属性让开发人员设置。显示目前密码强度的方式，可以用文字或图片表示；使用文字模式时，其显示的提示文字可由开发人员自行决定。开发人员可以自行调整密码必须具备的条件，例如，是否要包含有数字、字母或非文数字符号等，也可以设置区分字母的大小写等。
1-14
PasswordStrength控件
• MinimumNumericCharacters属性：设置密码中至少要包含多少个数字字符
• MinimumSymbolCharacters属性：设置密码中至少要包含多少个
非文数字的符号字符，如：、#、￥等。
• PreferredPasswordLength属性：设置密码长度，默认值为10
• TextCssClassD属性：当StrenthIndicatorType属性设置值为Text时，文字提示信息显示时所应用的样式表。
ห้องสมุดไป่ตู้
• TextStrengthDescriptions属性：当
1-15
PasswordStrength控件
网页实例
1-16
PopupControl控件
PopupControl控件可以很简单地创建弹出式窗口，而且几乎可以与任何控件结合，最大特色是可与 UpdatePanel控件合作，能在不刷新页面的情况下与服务器沟通，使弹出式窗口也具有异步更新功能。
口的控件名称。 PopupControlID属性：做为弹出窗口的控件名称。 CommitProperty属性：为弹出式窗口控件设置一个自定义属性，

AjaxControlToolKitDropDownExtender（下拉扩展控件）使用方法

AjaxControlToolKitDropDownExtender（下拉扩展控件）使⽤⽅法下⾯⼤概吧使⽤⽅法介绍下(这⾥使⽤Lable控件为例⼦)：1. 给页⾯添加⼀个ScriptManager控件（使⽤⽅法还没有研究完全，研究完全了试验写点经验）2.添加⼀个控制⽆刷新的UpdatePanel控件（同上）3.在UpdatePanel控件中添加俩个 Label控件⼀个⽤来添加DropDownExtender扩展，⼀个⽤来显⽰上个Label中取到的值,⼀个Panel控件在Panel控件中添加若⼲个LinkButton控件4.所有LinkButton公⽤⼀个Click事件，⽤来取值或者触发其他事件，我下⾯的例⼦主要是⽤来取值的。

5.在UpdatePanel中添加⼀个DropDownExtender控件a.设置DropDownExtender属性：TargetControlID （⽬标控件ID 或者靶⼦控件ID的意思吧）要吧DropDownExtender扩展到那个控件上，这⾥我是扩展到Label控件上，b.这个Label控件的属性中会出现⼀个Extender的属性⾥⾯有DropDownControlID 这⾥设置上⾯的PanelID6.添加第3步中添加的LinkButton的事件下⾯是简单例⼦的代码：页⾯代码：复制代码代码如下:<%@ Page Language="C#" AutoEventWireup="true" CodeFile="test2.aspx.cs" Inherits="test2" %><%@ Register Assembly="CrystalDecisions.Web, Version=10.2.3600.0, Culture=neutral,PublicKeyToken=692fbea5521e1304"Namespace="CrystalDecisions.Web" TagPrefix="CR" %><%@ Register Assembly="AjaxControlToolkit" Namespace="AjaxControlToolkit" TagPrefix="cc1" %><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="/1999/xhtml"><head runat="server"><title>DropDownExtender简单练习</title><style type="text/css">#Panel1{background:#ffcc00;font-size:12px;padding:0px;border:solid 1px;}#LinkButton1,#LinkButton2,#LinkButton3,#LinkButton4{color:#666;font-size:12px;}</style></head><body><form id="form1" runat="server"><div><asp:ScriptManager ID="ScriptManager1" runat="server"></asp:ScriptManager> </div><br /><asp:UpdatePanel ID="UpdatePanel1" runat="server"><ContentTemplate><asp:Label ID="Label2" runat="server" Text="Label" Width="129px"></asp:Label><br /><br /><asp:Label ID="Label1" runat="server" Text="请选择" Width="91px"></asp:Label><asp:Panel ID="Panel1" runat="server" Width="85px" Style="visibility: hidden"><asp:LinkButton ID="LinkButton1" runat="server" OnClick="lkbtn_Click">西安</asp:LinkButton><br /><asp:LinkButton ID="LinkButton2" runat="server" OnClick="lkbtn_Click">上海</asp:LinkButton><br /><asp:LinkButton ID="LinkButton3" runat="server" OnClick="lkbtn_Click">深圳</asp:LinkButton><br /><asp:LinkButton ID="LinkButton4" runat="server" OnClick="lkbtn_Click">北京</asp:LinkButton></asp:Panel><cc1:DropDownExtender ID="DropDownExtender1" runat="server" DropDownControlID="Panel1" TargetControlID="Label1"></cc1:DropDownExtender></ContentTemplate></asp:UpdatePanel></form></body></html>cs⽂件代码：复制代码代码如下:using System;using System.Data;using System.Configuration;using System.Collections;using System.Web;using System.Web.Security;using System.Web.UI;using System.Web.UI.WebControls;using System.Web.UI.WebControls.WebParts;using System.Web.UI.HtmlControls;public partial class test2 : System.Web.UI.Page{protected void Page_Load(object sender, EventArgs e){}protected void lkbtn_Click(object sender, EventArgs e){Label1.Text = ((LinkButton)sender).Text;Label2.Text = Label1.Text;}}先就介绍这点吧，leader过来了。

AJAX控件介绍

/u1/44087/showart_358464.html/ajax/ajaxcontroltoolkit/Samples/Accordion/Accordion.aspx1.Accordion【功能概述】Accordion可以让你设计多个panel 并且一次只显示一个Panel .在页面上的显示效果就像是使用了多个CollapsiblePanels只不过每一次只展开其中一个CollapsiblePanel.Accordion控件内部包含了若干个AccordionPane，每一个AccordionPane的template里包括了对其Header和Content的定义。

我们可以在后台代码中通过SelectedIndex属性取得当前展开的哪一个Panel，还可以控制哪一个Panel 展开。

经常可以见到类似的效果，比如QQ、Msn好友分类的折叠效果。

【细节】现在我们简单介绍一下面用到的Accordion的要用到的几个重要属性：SelectedIndex=“0”//刚进页面显示第一个AccordionPane中的内容AutoSize="Limit" //AutoSize选择Limit表示超出宽度和长度显示流动条Width="450px" 宽度Height="350px" 高度ContentCssClass="accordionContent" //内容样式HeaderCssClass="accordionHeader" //头部样式FadeTransitions="true" //true表示使用淡入效果TransitionDuration="250" //淡入时间（单位毫秒）FramesPerSecond="40" //每秒帧数下面是实现具体过程：首先是样式：（注：accordionHeader是头部样式，accordionContent是内容样式，cursor: pointer;表示的是当鼠标移动到该位置时变成手形，(1)不要把Accordion放在Table中而又把 FadeTransitions 设置为True，这将引起布局混乱(2) 在AccordionPane模板中的Content中可以定义任何Web元素，表现的就像一个容器(3) AccordionPane内容模板自动改变大小有三种AutoSize modes ：None(推荐) Limit Fill(4) $find('ctl00_ContentPlaceHolder1_MyAccordion_AccordionExtender')这里找到的是Behavior.什么是Behavior呢？在 Ajax框架中包含一组动作并完成一个功能. Accordion的一个Behavior就是淡入淡出.找到Behavior的引用，behavior.set_FadeTransitions() behavior.get_FadeTransitions()的方式来实现具体某一个Behavior的访问和修改.var behavior = $find('ctl00_SampleContent_MyAccordion_AccordionExtender');这种写法是不好的，我们在自动测试的页面中发现了更好的写法： var behavior=$find("<%= MyAccordion.ClientID %>_AccordionExtender");【代码示意】<script language="javascript" type="text/javascript">function toggleFade(){var behavior =$find('ctl00_ContentPlaceHolder1_MyAccordion_AccordionExtender');if (behavior){behavior.set_FadeTransitions(!behavior.get_FadeTransitions());}}function changeAutoSize(){var behavior =$find('ctl00_ContentPlaceHolder1_MyAccordion_AccordionExtender');var ctrl = $get('autosize'); //这里找的是下拉列表控件,不是Behaviorif (behavior){var size = 'None'; // 这里顺便看看怎么使用Selectswitch (ctrl.selectedIndex) {case 0 :behavior.get_element().style.height = 'auto';size = AjaxControlToolkit.AutoSize.None;break;case 1 :behavior.get_element().style.height = '400px';size = AjaxControlToolkit.AutoSize.Fill;break;case 2 :behavior.get_element().style.height = '400px';size = AjaxControlToolkit.AutoSize.Limit;break;}behavior.set_AutoSize(size);}if (document.focus){document.focus();}}</script><ajaxToolkit:Accordion ID="MyAccordion" runat="server" SelectedIndex="0" HeaderCssClass="accordionHeader"ContentCssClass="accordionContent" FadeTransitions="false" FramesPerSecond="40" TransitionDuration="250" AutoSize="None"><Panes><ajaxToolkit:AccordionPane ID="AccordionPane1" runat="server"><Header><a href="" onclick="return false;" class="accordionLink">1.Accordion</a></Header><Content></Content></ajaxToolkit:AccordionPane></Panes></ajaxToolkit:Accordion>2. AlwaysVisibleControl【功能概述】AlwaysVisibleControl 是一个简单的扩展控件可以让一部分内容浮动在页面上，当滚动页面或者改变浏览器大小时总是可见的。

快速浏览AjaxControlKit

快速浏览 AjaxControlKit 1．AlwaysVisibleControlExtender重要的几个属性：1.TargetControlID:需要悬浮的控件 ID。

2.VerticalSide:垂直方向悬浮方式：top，Middle,Bottom。

3.HorizontalSide:水平方向悬浮方式：left,center,right。

4.ScrollEffectDuration 从原始位置到定义的位置的移动效果时长。

Code<%@ RegisterAssembly="AjaxControlToolkit" Namespace="AjaxControlToolkit" TagPrefix="aj axToolkit" %><div><asp:ScriptManager ID="ScriptManager1" runat="server"></asp:ScriptManager><div><asp:UpdatePanel ID="UpdatePanel1" runat="server"><ContentTemplate><div style="width:230px;height:100px"><asp:Panel ID="timer" runat="server"Width="250px" BackColor="White" ForeColor="DarkBlue"BorderWidth="2" BorderStyle="solid" BorderColor="DarkBlue" style="zindex: 1; backgroundcolor:Green;"><div style="width: 100%; height: 100%; verticalalign: middl e; textalign: center;"><p>This is the Effect </p><span class="style1">我能始终悬浮</span></div></asp:Panel><ajaxToolkit:AlwaysVisibleControlExtender ID="AVCEx1" runat="se rver"TargetControlID="timer"VerticalSide="Top"VerticalOffset="10"HorizontalSide="Center"HorizontalOffset="10"ScrollEffectDuration=".1" /></div></ContentTemplate></asp:UpdatePanel></div></div>2．CalendarExtender主要属性：1.TargetControlID:需要扩展日历控件输入的文本框 ID2.CSSClass:展示的日历的CSS 样式类3.Format:所选择的日期的转化格式4.PopupButtonID:触发 CalendarExtend 控件 ID，不选择则默认为被更新的文本框 IDCode<asp:TextBox ID="TextBox1" runat="server"></asp:TextBox> <ajaxToolkit:CalendarExtender ID="CalendarExtender1" runat="server"PopupPosition="BottomRight" TargetControlID="TextBox1"CssClass="MyCalendar"Format="MMMM d, yyyy"></ajaxToolkit:CalendarExtender>扩展的日历的语言根据用户实际所在语言环境而改变，需要在 scriptmanager 中定义 Code<asp:ScriptManager ID="ScriptManager1" runat="server" EnableScriptGlobaliz ation="True" EnableScriptLocalization="True"></asp:ScriptManager>3．AutoCompleteExtender主要属性：1.TargetControlID:需要智能感知的 TextBox的 ID。

1、下载文档前请自行甄别文档内容的完整性，平台不提供额外的编辑、内容补充、找答案等附加服务。
2、"仅部分预览"的文档,不可在线预览部分如存在完整性等问题,可反馈申请退款(可完整预览的文档不适用该条件!)。
3、如文档侵犯您的权益，请联系客服反馈,我们会尽快为您处理(人工客服工作时间：9:00-18:30)。

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系统中最常见的气泡提示，比如你磁盘空间不足的时候……细节：是对数据验证控件的扩展，比较新鲜。