Ajax Asp.Net PasswordStrength Example

CSS StyleSheet

show source

01.BarIndicatorweak

02{

03 color:Red;

04 background-color:Red;

05}

06.BarIndicatoraverage

07{

08 color:Blue;

09 background-color:Blue;

10}

11.BarIndicatorgood

12{

13 color:Green;

14 background-color:Green;

15}

16

17.BarBorder

18{

19 border-style:solid;

20 border-width:1px;

21 padding:2px 2px 2px 2px;

22 width:200px;

23 vertical-align:middle;

24}

Now configure the passwordstrength control as shown below.

<form id="form1" runat="server">
<div>
<asp:ToolkitScriptManager ID="ToolkitScriptManager1" 
                          runat="server">

</asp:ToolkitScriptManager>

<asp:TextBox ID="TextBox1" runat="server" 
             TextMode="Password">
</asp:TextBox>

        <br />
<asp:PasswordStrength ID="PasswordStrength1" 
                      runat="server" 
         TargetControlID="TextBox1" 
         RequiresUpperAndLowerCaseCharacters="true"

         MinimumNumericCharacters="1" 
         MinimumSymbolCharacters="1" 
         MinimumUpperCaseCharacters="1" 
         PreferredPasswordLength="8"
         DisplayPosition="RightSide" 
         StrengthIndicatorType="Text">

</asp:PasswordStrength>
        <br />
        <br />
<asp:TextBox ID="TextBox2" runat="server" 
             TextMode="Password">

</asp:TextBox>
<asp:PasswordStrength ID="PasswordStrength2" 
                      runat="server" 
        TargetControlID="TextBox2" 
        RequiresUpperAndLowerCaseCharacters="true"

        MinimumNumericCharacters="1" 
        MinimumSymbolCharacters="1" 
        MinimumUpperCaseCharacters="1" 
        PreferredPasswordLength="8"
        DisplayPosition="RightSide" 
        StrengthIndicatorType="BarIndicator" 
        BarBorderCssClass="BarBorder" 

StrengthStyles="BarIndicatorweak;BarIndicatoraverage;BarIndicatorgood;">
</asp:PasswordStrength>
    </div>
    </form>