Ajax Control Toolkit 34个服务器端控件(3)

  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>