3

私は AjaxControlToolKit の PasswordStrength コントロールを使用しています。ユーザーがコントロールに何かを入力し始めると、パスワードが弱いというメッセージが表示され始めます。このメッセージは、最小数の文字が入力された後にのみ表示されるようにしたいと考えています。この機能を可能にするものはコントロールにありません。これをどのように処理すべきかについての提案はありますか?

4

2 に答える 2

2

テキスト入力のクライアント側イベントにアタッチします。そこで、 （テキストを使用している場合）1つのルール（条件としてテキストの長さを使用）を使用して、特別なCSSクラスを追加/削除できます。change keyupTextCssClassdisplay: none

于 2012-06-08T16:36:20.290 に答える
1

あなたはおそらくこれのためにあなた自身の解決策を転がす必要があるでしょう、それはあなたがそれについて考えるならば理にかなっています。2文字のパスワードは弱いが、3文字のパスワードで表示するという視覚的な手がかりを隠すことは、2文字のパスワードで十分であることを意味しているように見えます。

そうは言っても、あなたができるかもしれないことは、これに似たある種のハックを書くことです：

<script language="javascript">
  function onPasswordChange(textBox) {
      var passwordLabel = document.getElementById([labelID]);
      if(textBox.value.length < [constant]){
          passwordLabel.style.display = 'none';
      }
      else{
          passwordLabel.style.display = 'inline';            
      } 
  }
</script>

次に、この関数をアタッチして、コントロールがonKeyUpまたはonKeyDownイベントを変更し、パスワードフィールドの長さが希望の長さよりも短い場合に、強度が満たされていないというメッセージを含むラベルを非表示にします。これはテストされていない唯一の考えです。ツールキットのjavascriptがこのスクリプトと衝突する問題が発生する可能性がありますが、言うのは難しいです。

さらに、labelIDは[controlIDName]_PasswordStrengthのように見えます。

編集：

次のように、 onchangeonKeyUpまたはonKeyDownイベントをコントロールに追加することをお勧めします（コードビハインド）。

control.Attributes.Add（ "onchange"、 "onPasswordChange（this）"）;

 control.Attributes.Add("onKeyDown", "onPasswordChange(this)");

編集2：ハックに関する限り、これはかなり厄介ですが、機能します。クライアント側：

<asp:ScriptManager ID="ScriptManager1" runat="server">
</asp:ScriptManager>

<asp:TextBox ID="password" runat="server"></asp:TextBox>
<div id="PasswordStrengthContainer"></div>
<asp:PasswordStrength ID="PS" runat="server"
TargetControlID="password"  
DisplayPosition="RightSide"  
StrengthIndicatorType="Text"  
PreferredPasswordLength="10"  
PrefixText="Strength:"  
TextCssClass="TextIndicator_TextBox1"  
MinimumNumericCharacters="0"  
MinimumSymbolCharacters="0"  
RequiresUpperAndLowerCaseCharacters="false"  
TextStrengthDescriptions="Very Poor;Weak;Average;Strong;Excellent"  
TextStrengthDescriptionStyles="cssClass1;cssClass2;cssClass3;cssClass4;cssClass5"  
CalculationWeightings="50;15;15;20"
/>

 <script language="javascript">


function onPasswordChange(textBox) {
    var passwordLabel = document.getElementById("MainContent_password_PasswordStrength");
    var container = document.getElementById("PasswordStrengthContainer");

    if (passwordLabel != null) {
        document.getElementById("PasswordStrengthContainer").appendChild(
            document.getElementById("MainContent_password_PasswordStrength"));
    }

    if (textBox.value.length < 4) {
        container.style.display = 'none';
    }
    else {
        container.style.display = 'inline';
    }
}
 </script>

サーバ側：

 password.Attributes.Add("onKeyDown", "onPasswordChange(this)");
 password.Attributes.Add("onBlur", "onPasswordChange(this)");

このコードは効率的ではなく、クリーンアップすることもできますが、説明目的で機能します。javascript関数はかなり基本的ですが、次の行に気付くでしょう。

 if (passwordLabel != null) {
        document.getElementById("PasswordStrengthContainer").appendChild(
            document.getElementById("MainContent_password_PasswordStrength"));
    }

残念ながら、ツールキットのjavascript関数は関数の後に起動するため、表示を「none」に設定するとツールキットによって消去されます。このコードが行うことは、ページからラベルを削除してdivに配置することです。次に、divのdisplayプロパティを何にでも設定するだけで、ラベルを効果的に非表示にできます。ただし、特異なバグがあります。バックスペースを押して文字を削除すると、特定のインスタンスでdivが消えない場合があります。問題を突き止める時間はあまりありませんが、問題を解決するのは簡単なことです。

さらに、ChromeのonChangeで問題が発生したため、@Adrianoが上記で指摘したように代わりにonKeyDownを選択しました。

于 2012-06-08T16:59:13.493 に答える