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

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>&nbsp;</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" />

18. NoBot

【功能概述】

提供了简单的Captcha 图灵测试 用来屏蔽bot/spam 垃圾信息。是一个反垃圾信息控件。我查了一下资料，我的理解是：比如你点击一个按钮需要一秒钟的时间，而这一秒钟的时间你不可能再做其他的操作比如再点一次；这样区分出了人和机器。避免机器人自动点击 注册 暴力破解之类的事情
  【 细节】

 (1)OnGenerateChallengeAndResponse 这个属性是EventHandler<NoBotEventArgs> 调用服务器端的方法，注意方法签名
                       例如：   protected void CustomChallengeResponse(object sender, NoBotEventArgs e) {……}

【示意代码】

 代码示意：
    <ajaxToolkit:NoBot
  ID="NoBot2"
  runat="server"
  OnGenerateChallengeAndResponse="CustomChallengeResponse"
  ResponseMinimumDelaySeconds="2"
  CutoffWindowSeconds="60"
  CutoffMaximumInstances="5" />

19. NumericUpDown

【功能概述】

实现Winform里面的Updown控件，可以自定义最大值最小值增减步长，同时还可以使用值列表或者调用Web Service来决定下一个值是什么。上下按钮的图片同样是可以自定义的。

   【细节】

 (1)普通整数增减
               (2)值列表循环显示比如下面的第二个例子RefValues
                (3)调用Web Service的格式：               

<ajaxToolkit:NumericUpDownExtender ID="NUD1" runat="server"
    TargetControlID="TextBox1" 
    Width="100"
    RefValues="January;February;March;April"
    TargetButtonDownID="Button1"
    TargetButtonUpID="Button2"
    ServiceDownPath="WebService1.asmx"
    ServiceDownMethod="PrevValue"
    ServiceUpPath="WebService1.asmx"
    ServiceUpMethod="NextValue"
    Tag="1" />

(4)上下按钮如果不需美化就这样使用：TargetButtonDownID=" " TargetButtonUpID=" "

 

【示意代码】
代码示意：
           <ajaxToolkit:NumericUpDownExtender ID="NumericUpDownExtender1" runat="server"
                    TargetControlID="TextBox1" Width="120" RefValues=""
                    ServiceDownMethod="" ServiceUpMethod="" TargetButtonDownID="" TargetButtonUpID="" />
                <ajaxToolkit:NumericUpDownExtender ID="NumericUpDownExtender2" runat="server"
                    TargetControlID="TextBox2" Width="120" RefValues="January;February;March;April;May;June;July;August;September;October;November;December"
                    ServiceDownMethod="" ServiceUpMethod="" TargetButtonDownID="" TargetButtonUpID="" />
                       <ajaxToolkit:NumericUpDownExtender ID="NumericUpDownExtender4" runat="server"
                    TargetControlID="TextBox4" Width="80" TargetButtonDownID="img1"
                    TargetButtonUpID="img2" RefValues="" ServiceDownMethod="" ServiceUpMethod="" />

20. PagingBulletedList

【功能概述】

PagingBulletedList 扩展BulletedList的分页功能并实现客户端的排序分页。这里提供的分页是相当灵活的有各种分页方法供选择。

   【细节】

 (1)可以控制每页最多显示多少条，是否排序
 (2)IndexSize表示index headings 的字符数，如果MaxItemPerPage设置了概属性被忽略
 (3)MaxItemPerPage分页每页最大条数

【示意代码】

代码示意：
 <ajaxToolkit:PagingBulletedListExtender ID="PagingBulletedListExtender1" BehaviorID="PagingBulletedListBehavior1" runat="server"
                    TargetControlID="BulletedList1"
                    ClientSort="true"
                    IndexSize="1"
                    Separator=" - "
                    SelectIndexCssClass="selectIndex"
                    UnselectIndexCssClass="unselectIndex" />