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

21. PasswordStrength

【功能】

验证密码强度，微软Live注册的时候就是用的这个效果。

【细节】

 StrengthIndicatorType两种显示方式：文字提示，进度条提示。

示例中Textbox1 Textbox3都没有添加TextMode="Password" 所以在界面上我们可以输入中文；而且输入中文很快就达到较高安全度，当然这没有什么用处。

【示意代码】

代码示意：
<ajaxToolkit:PasswordStrength ID="PasswordStrength1" runat="server" DisplayPosition="RightSide" TargetControlID="TextBox1"
                    StrengthIndicatorType="Text" PreferredPasswordLength="10" PrefixText="Strength:" 
                    HelpStatusLabelID="TextBox1_HelpLabel" TextCssClass="TextIndicator_TextBox1"  TextStrengthDescriptions="Very Poor;Weak;Average;Strong;Excellent"
                    MinimumNumericCharacters="0" MinimumSymbolCharacters="0" RequiresUpperAndLowerCaseCharacters="false"/>
    <ajaxToolkit:PasswordStrength ID="PasswordStrength2" runat="server" DisplayPosition="RightSide" TargetControlID="TextBox2"
                    StrengthIndicatorType="BarIndicator" PreferredPasswordLength="15" HelpStatusLabelID="TextBox2_HelpLabel"
                     BarIndicatorCssClass="BarIndicator_TextBox2" BarBorderCssClass="BarBorder_TextBox2"
                     MinimumNumericCharacters="1" MinimumSymbolCharacters="1" RequiresUpperAndLowerCaseCharacters="true" />
    <ajaxToolkit:PasswordStrength ID="PasswordStrength3" runat="server" DisplayPosition="BelowLeft" TargetControlID="TextBox3"
                    StrengthIndicatorType="Text" PreferredPasswordLength="20" PrefixText="Meets Policy? " TextCssClass="TextIndicator_TextBox3"
                     MinimumNumericCharacters="2" MinimumSymbolCharacters="2" RequiresUpperAndLowerCaseCharacters="true"
                     TextStrengthDescriptions="Not at all;Very Low compliance;Low Compliance;Average Compliance;Good Compliance;Very High Compliance;Yes"
                     HelpHandleCssClass="TextIndicator_TextBox3_Handle" HelpHandlePosition="LeftSide" />

22．PopupControl

【功能概述】

PopupControl任何控件上都可以弹出任何内容，跟HoverMenu功能类似。Popup 窗口一般是放在ASP.NET AJAX UpdatePanel中, 因此它能够完成服务器端的处理之后更能新数据

显示. Popup Window 可以包含任何内容包括 ASP.NET server controls, HTML elements, etc.

【细节】

(1)TargetControlID - The ID of the control to attach to
                (2)PopupControlID - The ID of the control to display
                (3)CommitProperty -属性来标识返回的值
                (4) CommitScript -把返回结果值通过脚本处理，用到CommitProperty

  【代码示意】
      <ajaxToolkit:PopupControlExtender  ID="PopupControlExtender2" runat="server" TargetControlID="MessageTextBox" 
      PopupControlID="Panel2" CommitProperty="value" CommitScript="e.value += ' - do not forget!';" Position="Bottom" />

23.Rating

【功能概述】

使用星级表示等级，鼠标操作；

【细节】

鼠标移动等级也会变，而你真正要修改还要点击一下；这是延续了WP10里面等级评定控件的传统，也许这样设计是真的有道理，我不清除。

【示意代码】

  代码示意：
   <ajaxToolkit:Rating ID="ThaiRating" runat="server"
    CurrentRating="2"
    MaxRating="5"
    StarCssClass="ratingStar"
    WaitingStarCssClass="savedRatingStar"
    FilledStarCssClass="filledRatingStar"
    EmptyStarCssClass="emptyRatingStar"
    OnChanged="ThaiRating_Changed" /> 
    

24．ReorderList

【功能概述】

ReorderList是一个全新的控件。它可以实现逐条列出数据并实现交互。用户简单的拖拽就可以改变数据的排列顺序并更新到数据源。在本控件中如果SortOrderField 属性设置之后排序将自动完成。

【细节】

(1)绑定数据，拖动数据之后数据将被更新到绑定源
                (2)它不是已有控件的扩展是全新的服务器端控件，只是它对Ajax行为是敏感的
                (3)重排的实现有两种方式：CallBack PostBack 前者的发生在页面上是没有PostBack的（也就是没有刷新页面）
                (4) 而数据添加或者编辑的时候就必须要使用PostBack来同步服务器端的数据状态
                (5)PostbackOnReorder就是针对两种策略进行选择
【示意代码】

代码示意：
   <ajaxToolkit:ReorderList ID="ReorderList1" runat="server" 
    DataSourceID="ObjectDataSource1"
    DragHandleAlignment="Left" 
    ItemInsertLocation="Beginning"
    DataKeyField="ItemID" 
    SortOrderField="Priority"
    AllowReorder="true">
      <ItemTemplate> </ItemTemplate>
      <ReorderTemplate> </ReorderTemplate>
      <DragHandleTemplate> </DragHandleTemplate>
      <InsertItemTemplate> </InsertItemTemplate>
</ajaxToolkit:ReorderList>

这个控件是非常独立，并且还是适用于表现Buleted的数据，二维数据就无能为例了
            DataSourceID="ObjectDataSource1" 这是必须要有的！下面是它的Template框架：

  <ajaxToolkit:ReorderList ID="ReorderList1" PostBackOnReorder="false" runat="server" DataSourceID="ObjectDataSource1" CallbackCssStyle="callbackStyle"
        DragHandleAlignment="Left" ItemInsertLocation="Beginning" DataKeyField="ItemID" SortOrderField="Priority">
        <ItemTemplate></ItemTemplate>
        <EditItemTemplate></EditItemTemplate>
        <ReorderTemplate></ReorderTemplate>
        <DragHandleTemplate> </DragHandleTemplate>
        <InsertItemTemplate> </InsertItemTemplate>
    </ajaxToolkit:ReorderList>

25. ResizableControl

【功能概述】

就像设计状态一样可以拖动修改大小，可是有什么实际的意义么，放大字体？没有想到
【 细节】

(1)   HandleCssClass - The name of the CSS class to apply to the resize handle 这个属性必须要有！

(2)   WEB2.0时代用户什么都是可以自定义的？？难道是这个原则下的产物么？？不理解

(3)   在前卫的飞鸽网站上我都一直没有看到关于ResizableControl的应用，期待一个成功的应用

【示意代码】

  代码示意：
<ajaxToolkit:ResizableControlExtender ID="RCE" runat="server"
    TargetControlID="PanelImage"
    HandleCssClass="handleImage"
    ResizableCssClass="resizingImage"
    MinimumWidth="50"
    MinimumHeight="20"
    MaximumWidth="260"
    MaximumHeight="130"
    OnClientResize="OnClientResizeImage"
    HandleOffsetX="3"
    HandleOffsetY="3" />