1. Accordion
【功能概述】
Accordion可以讓你設計多個panel 並且一次只顯示一個Panel .在頁面上的顯示效果就像是使用了多個CollapsiblePanels只不過每一次只展開其中一個CollapsiblePanel.Accordion控制項內部包含了若干個AccordionPane，每一個AccordionPane的template裡包括了對其Header和Content的定義。我們可以在後台代碼中通過SelectedIndex屬性取得當前展開的哪一個Panel，還可以控制哪一個Panel展開。
經常可以見到類似的效果，比如QQ、Msn好友分類的摺疊效果。
【細節】
(1)不要把Accordion放在Table中而又把 FadeTransitions 設定為True，這將引起布局混亂
(2) 在AccordionPane模板中的Content中可以定義任何Web元素，表現的就像一個容器
(3) AccordionPane內容範本自動改變大小有三種AutoSize modes ：None(推薦) Limit Fill
(4) $find('ctl00_ContentPlaceHolder1_MyAccordion_AccordionExtender')這裡找到的是Behavior.什麼是Behavior呢？在Asp.net 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'); //這裡找的是下拉式清單控制項,不是Behavior
if (behavior) {
var size = 'None'; // 這裡順便看看怎麼使用Select
switch (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 是一個簡單的擴充控制項可以讓一部分內容浮動在頁面上，當滾動頁面或者改變瀏覽器大小時總是可見的。它可以擴充任意一個Asp.net 控制項，並可按照要求設定水平 豎直方向上的相對距離.
最多的應用是線上閱讀的目錄和不勝其煩的浮動小廣告。
【細節】
(1) 避免控制項閃爍，要擴充的控制項要使用absolutely position
(2) HorizontalSide="Center" VerticalSide="Top" 使用這個方式控制浮動的位置
(3) Var label = ocument.getElementById('ctl00_SampleContent_currentTime');這行代碼我們可以使用更簡單的方法：
var label = $get('ctl00_SampleContent_currentTime');
【代碼示意】
代碼示意：
<cc1:AlwaysVisibleControlExtender ID="AlwaysVisibleControlExtender1" HorizontalSide="Center" VerticalSide="Top" TargetControlID="Panel1" runat="server">
3. Animation
【功能概述】
28個控制項種效果最酷的！顧名思義實現動畫效果。它是一個插入式，可擴充的架構可以方便的為你的頁面添加動畫效果。
【細節】
請參考頁面代碼閱讀下面的細節內容:
(1)Sys.UI.DomElement.getLocation(b) 取得控制項位置的函數，常用！！！
(2)動畫分為兩種：Animation Action 後者的強大讓我很興奮
(3)<Sequence> </Sequence> 順序執行的動畫指令碼
(4)<Parallel> <Parallel > 並發執行的動畫指令碼
(5)【Action】 <StyleAction AnimationTarget="btnCloseParent" Attribute="opacity" value="0" /> 控制目標元素外觀樣式，屬性--值的格式修改，一個元素可以應用多個StyleAction
(6)【Action】<EnableAction AnimationTarget="ctl00_ContentPlaceHolder1_btnInfo" Enabled="true" /> 控制項是否可用使用的方式跟上面是一樣的，當前控制項可省略AnimationTarget
(7)【Action】 <ScriptAction Script="Cover($get('ctl00_ContentPlaceHolder1_btnInfo'), $get('flyout'));" />執行一段指令碼的Action
(8) 【Action】 <HideAction />隱藏目標的控制項
(9) 【Action】<OpacityAction AnimationTarget="info" Opacity="0" /> 設定透明度的Action
(10)【Animation】 <FadeIn AnimationTarget="info" Duration=".2"/> <FadeOut /> 淡入淡出
(11)【Animation】<Scale ScaleFactor="0.05" Center="true" ScaleFont="true" FontUnit="px" /> 控制目標元素的大小但是注意：If scaleFont is true, the size of the font will also scale with the element. If center is true, then the element's center will not move as it is scaled. It is important to note that the target must be positioned (i.e. absolutely) so that settings its top/left properties will change its location in order for center to have an effect.
(12) 【Animation】 <Pulse Duration=".1" /> 脈搏跳動效果
(13)【Animation】 <Color Duration=".2" StartValue="#FFFFFF" EndValue="#FF0000" Property="style" PropertyKey="color" /> 色彩坡形效果，設定起始結束顏色就可以
(14) 【Animation】 <Resize Width="260" Height="280" />改變元素的大小Action
(15)動畫效果是在使用者某一個動作發生的時候觸發，觸發的時機包括：OnLoad OnClick OnMouseOver OnMouseOut OnHoverOver OnHoverOut
正式版的分頁檔為動畫指令碼添加了注釋更加清晰易懂.上面列出的是常用的一些動畫效果，全部資料參見Anmation Reference。
仔細閱讀Animation的頁面代碼，其實我們已經提前觸摸到了Xaml的編程風格。Asp.net Ajax之後的下一代WEB介面是WPF/E,WPF/E現在支援的是”javascript+Xaml” 還不支援”C# + Xaml”。
下一代的WEB UI會是怎樣的？下一個版本的Asp.net 會怎樣安排Ajax的位置？WPF/E會不會被整合在新版本的Asp.net中呢？期待中……
【示意代碼】
代碼示意：
<AjaxToolkit:AnimationExtender ID="ae"
runat="server" TargetControlID="ctrl">
<Animations>
<OnLoad> </OnLoad>
<OnClick> </OnClick>
<OnMouseOver> </OnMouseOver>
<OnMouseOut> </OnMouseOut>
<OnHoverOver> </OnHoverOver>
<OnHoverOut> </OnHoverOut>
</Animations>
</AjaxToolkit:AnimationExtender>
4. AutoComplete NEW!!!
【功能概述】
AutoComplete控制項是對Asp.net文字框控制項的擴充，當使用者詞彙前面的字母時以彈出地區的形式給出備選詞。這個功能的完成依賴於特定的Web Service。
在正式版的Ajax Control Toolkit中看到自動完成擴充控制項有一種感覺：它終於出現在了它應該出現的地方。之前AutoComplete控制項是在CTP版本中以核心組件的形式出現的，這個功能極為明確的控制項被歸類到核心組件，我還是比較迷惑。正式版中它終於成為了一個擴充控制項。
Google的自動完成功能，新浪 網易等信箱的收件者自動完成功能是這個功能的成功應用。
【細節】
從Atlas的版本開始，AutoComplete的使用方法就沒有太大的改變，只要注意：
(1)調用的Web Service方法簽名有要求：
[WebMethod]
public string[] GetCompletionList(string prefixText, int count) { ... }
(2)MinimumPrefixLength最短前置詞字元數，就是說你至少要鍵入幾個字元才會出現提示
5. Calendar NEW!!!
【功能概述】
Calendar同樣是對文字框的擴充，當點擊文字框的時候彈出日期選擇選項。現在的版本提供的功能已經和WinForm中的日期控制項一樣，可以通過點擊日期選擇，點擊箭頭在年月之間切換。
【細節】
(1)同樣是對文字框的擴充，文字框獲得焦點就會出現日期選擇，樣式是可以自訂的
(2)雖然一定是對文字框的擴充但是我們還是可以指定退出鍵PopupButtonID，一旦這個值設定了，文字框獲得焦點也不會彈出日期選擇
(3)不需要把它放在UpdatePanel中
6. CascadingDropDown
【功能概述】
CascadingDropDown 控制項是對ASP.NET DropDownList control的擴充，實現對一個DropDownList操作時其它DropDownList發生相應的變化。這個功能的實現依賴於Web Service。
【細節】
(1)如果使用Web service 方法簽名必須符合下面的形式：
[WebMethod]
public CascadingDropDownNameValue[] GetDropDownContents(
string knownCategoryValues, string category){...}
(2)在閱讀代碼的時候請關註：Category屬性。官方說法The name of the category this DropDownList represents 實開啟~/App_Data/CarsService.xml你就發現這是Xml的元素標籤。從這個角度我們就解決了為什麼聯動，即聯動的本質；同時也明白了調用Service的參數約定。
【示意代碼】
<AjaxToolkit:CascadingDropDown ID="CascadingDropDown1" runat="server" TargetControlID="DropDownList1" Category="Make" PromptText="Please select a make" LoadingText="[Loading makes ]" ServicePath="CarsService.asmx" ServiceMethod="GetDropDownContents"/>
<AjaxToolkit:CascadingDropDown ID="CascadingDropDown2" runat="server" TargetControlID="DropDownList2" Category="Model" PromptText="Please select a model" LoadingText="[Loading models ]" ServiceMethod="GetDropDownContentsPageMethod" ParentControlID="DropDownList1"/>
<AjaxToolkit:CascadingDropDown ID="CascadingDropDown3" runat="server" TargetControlID="DropDownList3" Category="Color" PromptText="Please select a color" LoadingText="[Loading colors ]" ServicePath="~/CascadingDropDown/CarsService.asmx" ServiceMethod="GetDropDownContents" ParentControlID="DropDownList2"/>
另外頁面上還有一段定義UpdatePanel的代碼很典型，可以作為參考：
<asp:UpdatePanel ID="UpdatePanel1" runat="server" UpdateMode="Conditional" RenderMode="inline">
<ContentTemplate>
<asp:Label ID="Label1" runat="server" Text="[No response provided yet]" />
</ContentTemplate>
<Triggers>
<asp:AsyncPostBackTrigger ControlID="DropDownList3" EventName="SelectedIndexChanged" />
</Triggers>
</asp:UpdatePanel>
7. CollapsiblePanel
【功能概述】
這個控制項幾乎在每一個頁面上都出現了。它是非常靈活的一個控制項，可以擴充任何ASP.NET Panel control。在頁面上輕鬆實現展開收縮效果。這種效果我們最熟悉的恐怕就是XP的檔案工作列了。
【細節】
(1) CollapsiblePanel 預設認為使用了 標準 CSS box model 早期的瀏覽器要!DOCTYPE 中設定頁面為自適應方式提交資料rendered in IE's standards-compliant mode.
(2) 可以自動延伸 自動收縮Autoexpand="true" AutoCollapse="true"但是這兩個本身是互斥的不能同時為True;如果設定了這兩個屬性其中一個為True就不要在設定 Collapsed="True"，這樣就沒有意義了。
(3) TextLabelID="Label1"這個屬性有什麼深意\進階的操作嗎？我還在研究。。。
代碼示意：
<AjaxToolkit:CollapsiblePanelExtender ID="cpe" runat="Server"
TargetControlID="Panel1"
CollapsedSize="0"
ExpandedSize="300"
Collapsed="True"
ExpandControlID="LinkButton1"
CollapseControlID="LinkButton1"
AutoCollapse="False"
AutoExpand="False"
ScrollContents="True"
TextLabelID="Label1"
CollapsedText="Show Details "
OpenedText="Hide Details"
ImageControlID="Image1"
ExpandedImage="~/images/collapse.jpg"
CollapsedImage="~/images/expand.jpg"
ExpandDirection="Height"/>
8. ConfirmButton
【功能概述】
這個控制項是對Button和繼承了Button的控制項的擴充，它可以捕捉到使用者點擊了對話方塊中的“是”“否”；如果是“是”就繼續執行後面的代碼，反之就停止執行它預設的提交行為。
【細節】
(1) 要擴充的LinkButton Button 以及ConfirmButtonExtender都要放在updatepanel裡面
如果是放在外面，點擊“確定”或者“取消”之後還是會導致頁面重新整理！
(2)更簡單的方法：
this.Button1.Attributes["onclick"]="javascript:return confirm('確定要停止下載嗎？');";
(3) 如果是需要伺服器端擷取使用者選擇，還是使用模式彈出吧
9.DragPanel
【功能概述】
DragPanel extender可以輕鬆的讓控制項 "draggability".DragPanel 擴充的目標是任意 ASP.NET Panel .你可以設定拖動行為的細節，比如哪裡是類似於標題列一樣的地區。
【細節】
(1) TargetControlID 要拖動的控制項
(2) DragHandleID 拖動的標題列所在的ControlID 範例程式碼中： panel6包含panel7（標題） panel8（內容）擴充的對象是panel6
(3) 是不是發現這段JS代碼了呢？如果去掉這段代碼，圖到頁面邊緣的時候是不正常的，它自己跑回原來位置了 :)
<script type="text/javascript">
// The following snippet works around a problem where FloatingBehavior
// doesn't allow drops outside the "content area" of the page - where "content
// area" is a little unusual for our sample web pages due to their use of CSS
// for layout.
function setBodyHeightToContentHeight() {
document.body.style.height = Math.max(document.documentElement.scrollHeight, document.body.scrollHeight)+"px";
}
setBodyHeightToContentHeight();
$addHandler(window, "resize", setBodyHeightToContentHeight);
</script>
【示意代碼】
代碼示意
<AjaxToolkit:DragPanelExtender ID="DPE1" runat="server"
TargetControlID="Panel3"
DragHandleID="Panel4" />
10. DropDown
【功能概述】
DropDown 同樣是一個 ASP.NET Ajax extender 可以對任何 ASP.NET control 進行擴充實現 SharePoint-style drop-down menu效果。彈出的只不過是其它的panel或者控制項而已。 在IE瀏覽器中下拉式清單總是在最前面的，的確是影響頁面效果，這個控制項的出現可以解決這一問題.這隨時隨地的快顯視窗成為WEB 2.0網站的標誌性建築，彈出的東西也越來越豐富。
【細節】
(1)TargetControlID要在什麼控制項上實現擴充
(2)DropDownControlID彈出來什麼
(3) 樣本中是對一個Label進行的擴充，我試著擴充TextBox效果更好！
【示意代碼】
代碼示意：
<asp:Panel ID="DropPanel" runat="server" CssClass="ContextMenuPanel" Style="display: none;
visibility: hidden;">
<asp:LinkButton runat="server" ID="Option1" Text="Option 1" CssClass="ContextMenuItem"
OnClick="OnSelect" />
<asp:LinkButton runat="server" ID="Option2" Text="Option 2" CssClass="ContextMenuItem"
OnClick="OnSelect" />
<asp:LinkButton runat="server" ID="Option3" Text="Option 3 (Click Me!)" CssClass="ContextMenuItem"
OnClick="OnSelect" />
</asp:Panel>
<cc1:DropDownExtender runat="server" ID="DDE" TargetControlID="TextLabel"
DropDownControlID="DropPanel" />
還有一段代碼有很多可以學習的地方：
代碼示意：
<asp:UpdatePanel id="Update" runat="server">
<ContentTemplate>
<asp:Label id="lblSelection" runat="server" Style="padding: 5px;" />
</ContentTemplate>
<Triggers>
<asp:AsyncPostBackTrigger ControlID="Option1" EventName="Click" />
<asp:AsyncPostBackTrigger ControlID="Option2" EventName="Click" />
<asp:AsyncPostBackTrigger ControlID="Option3" EventName="Click" />
</Triggers>
</asp:UpdatePanel>
<AjaxToolkit:UpdatePanelAnimationExtender ID="UpdateAnimation" runat="server" TargetControlID="Update" BehaviorID="Highlight">
<Animations>
<OnUpdated>
<Sequence>
<ScriptAction Script="$find('Highlight')._onUpdated._animation._animations[1].set_target($get('ctl00_ContentPlaceHolder1_lblSelection'));" />
<Color Duration=".5" StartValue="#FFFF90" EndValue="#FFFFFF" Property="style" PropertyKey="backgroundColor" />
</Sequence>
</OnUpdated>
</Animations>
</AjaxToolkit:UpdatePanelAnimationExtender>
11. DropShadow
【功能概述】
陰影製作效果
【 細節】
(1) Width 單位：px 預設5px
(2) Opacity 不透明度0-1.0 預設.5
【示意代碼】
代碼示意：
<AjaxToolkit:DropShadowExtender ID="dse" runat="server"
TargetControlID="Panel1"
Opacity=".8"
Rounded="true"
TrackPosition="true" />
12. DynamicPopulate
【功能概述】
能實用Web Service或頁面方法來動態替換控制項的內容。調用的方法返回的是一個Html的字串，作為目標元素的子節點插入其中。
【 細節】
(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.
(5) 我們非常欣慰的一點就是BehaviorID="dp1",這種用法是我所期望的。
(6) CustomScript 怎麼用呢？？This script must evaluate to a string value. ??
【示意代碼】
代碼示意：
<AjaxToolkit:DynamicPopulateExtender ID="dp" runat="server"
TargetControlID="Panel1"
ClearContentsDuringUpdate="true"
PopulateTriggerControlID="Label1"
ServiceMethod="GetHtml"
UpdatingCssClass="dynamicPopulate_Updating" />
代碼示意2：
<asp:Panel ID="Panel1" runat="server" CssClass="dynamicPopulate_Normal">
</asp:Panel> //要擴充的panel
<AjaxToolkit:DynamicPopulateExtender ID="dp" BehaviorID="dp1" runat="server"
ClearContentsDuringUpdate="true"
PopulateTriggerControlID="Label1"
TargetControlID="Panel1"
ServiceMethod="GetHtml"
UpdatingCssClass="dynamicPopulate_Updating">
</AjaxToolkit:DynamicPopulateExtender>
<script runat="server">
[System.Web.Services.WebMethod]
[System.Web.Script.Services.ScriptMethod]
public static string GetHtml(string contextKey) {
// a little pause to mimic a latent call.
//
System.Threading.Thread.Sleep(250);
string value = "";
if (contextKey == "U") {
value = DateTime.UtcNow.ToString();
} else {
value = String.Format("{0:" + contextKey + "}", DateTime.Now);
}
return String.Format("<span style='font-family:courier new;font-weight:bold;'>{0}</span>", value);
}
</script>
<asp:Content ID="Content1" ContentPlaceHolderID="ContentPlaceHolder1" Runat="Server">
<script type="text/javascript">
function updateDateKey(value) {
var behavior = $find('dp1'); //這樣使用BehaviorID可是方便多了
if (behavior) {
behavior.populate(value);// 內部實現調用了Service
}
}
Sys.Application.add_load(function() {updateDateKey('G');}); //頁面載入時要執行的指令碼！
</script>
13. FilteredTextBox
【功能概述】
FilteredTextBox擴充控制項用來阻止使用者在文字框輸入無效字元 。由於這種效果的實現是依賴於deactivating JavaScript（怎麼翻譯呢？）,所以不要期望資料會發送到伺服器端進行校正。
【細節】
(1)過濾條件Numbers LowercaseLetters UppercaseLetters Custom
(2)過濾條件也可以是Custom的組合 FilterType="Custom, Numbers"
(3)ValidChars="+-=/*()." Custom要定義這樣的有效字串
(4)這個控制項我認為是聊勝於無，我們要把允許輸入的資料進行枚舉，太難了。事實上，這個控制項在任何狀態下都是接受中文的。如果使用Regex情形或許好些。看它的實現代碼還有進一步改進的可能，學習研究中……
【示意代碼】
示意代碼：
<AjaxToolkit:FilteredTextBoxExtender ID="ftbe" runat="server"
TargetControlID="TextBox3"
FilterType="Custom, Numbers"
ValidChars="+-=/*()." />
在該控制項的實現代碼中我發現了這樣一段,這可能是一個突破口：
特殊鍵排除代碼：
< var scanCode;
if (evt.rawEvent.keyIdentifier) {
// Safari
// Note (Garbin): used the underlying rawEvent insted of the DomEvent instance.
if (evt.rawEvent.ctrlKey || evt.rawEvent.altKey || evt.rawEvent.metaKey) {
return;
}
if (evt.rawEvent.keyIdentifier.substring(0,2) != "U+") {
return;
}
scanCode = evt.rawEvent.charCode;
if (scanCode == 63272 /* Delete */) {
return;
}
}
else {
scanCode = evt.charCode;
}
if (scanCode && scanCode >= 0x20 /* space */) {
var c = String.fromCharCode(scanCode);
if(!this._processKey(c)) {
evt.preventDefault();
}
}
}
14. HoverMenu
【功能概述】
HoverMenu控制項可以擴充任何 ASP.NET WebControl, 同時將把附加的顯示內容關聯到該控制項上，當使用者移動滑鼠到該控制項的時候附加的內容將顯示出來。
【細節】
(1) PopupControlID要彈出來什麼
(2)PopupPostion 在哪裡彈出來Left (Default), Right, Top, Bottom, Center.
(3)OffsetX/OffsetY 彈出項與原始檔控制的距離
(4) PopDelay 彈出延時顯示 單位milliseconds. Default is 100.
【代碼示意】
代碼示意：
<AjaxToolkit:HoverMenuExtender ID="hme2" runat="Server"
TargetControlID="Panel9"
HoverCssClass="popupHover"
PopupControlID="PopupMenu"
PopupPosition="Left"
OffsetX="0"
OffsetY="0"
PopDelay="50" />
樣本頁面上還有一個小細節：
HttpUtility.HtmlEncode()使用 HttpUtility.HtmlEncode 將危險的符號轉換為它們的 HTML 表示形式。
代碼示意：
<asp:Label Font-Bold="true" ID="Label1" runat="server" Text='<%# HttpUtility.HtmlEncode(Convert.ToString(Eval("Title"))) %>'></asp:Label></td>
<asp:Label ID="Label2" runat="server" Text='<%# HttpUtility.HtmlEncode(Convert.ToString(Eval("Description"))) %>'></asp:Label></td>
<asp:Label ID="Label3" runat="server" Text='<%# Eval("Priority") %>'></asp:Label>
15. MaskedEdit NEW！！！
【功能概述】
MaskedEdit 控制項是對TextBox control的擴充.使用者輸入會在用戶端進行驗證。在樣本頁面中，我感覺實際效果並不是太好所以沒有深入學習，不多說了。
16. ModalPopup
【功能概述】
ModalPopup 擴充控制項允許在頁面上模式彈出內容並阻止使用者和頁面上其他地區的互動。模式彈出地區的樣式都是可以自訂的。 使用者可以在模式彈出框選擇OK/Cancel，對使用者選擇的處理方式有兩種：使用用戶端指令碼或者PostBack到伺服器端。這樣我們就得到了使用者的選擇結果！
【細節】
(1) 看下面的代碼可以看到執行用戶端指令碼的方法。
(2) 應該說這個控制項是提供了一個模式彈出對話方塊的模板
(3) 在正式版以前的所有版本，這個控制項在Opear瀏覽器中都是不正常的。正式版已經修正這個BUG，現在正在比較學習兩個版本的原始碼，看看問題的原因和解決方案是什麼。
【示意代碼】
代碼示意：
<asp:Panel ID="Panel2" runat="server" CssClass="modalPopup" style="display:none">
<p>
<asp:Label ID="Label1" runat="server" BackColor="Blue" ForeColor="White" Style="position: relative"
Text="資訊提示"></asp:Label> </p>
<p >確定要刪除當前下載的任務嗎？</p>
<p style="text-align:center;">
<asp:Button ID="Button1" runat="server" Text="OK" ></asp:Button>
<asp:Button ID="Button2" runat="server" Text="Cancel"></asp:Button>
</p>
</asp:Panel>
<AjaxToolkit:ModalPopupExtender ID="ModalPopupExtender" runat="server" TargetControlID="LinkButton1"
PopupControlID="Panel2" BackgroundCssClass="modalBackground" DropShadow="true"
OkControlID="Button1" OnOkScript="onOk()" CancelControlID="CancelButton" />
17. MutuallyExclusiveCheckBox
【功能概述】
互斥複選框就像RadioButton一樣，應用的情境是：“a number of choices are available but only one can be chosen”
【細節】
(1)Key屬性用來分組就像RdiolistGroup一樣
(2)argetControlID用來綁定已有的CheckBox
【代碼示意】
<AjaxToolkit:MutuallyExclusiveCheckboxExtender runat="server"
ID="MustHaveGuestBedroomCheckBoxEx"
TargetControlID="MustHaveGuestBedroomCheckBox"
Key="GuestBedroomCheckBoxes" />
當前1/2頁
12下一頁閱讀全文
