0

jQuery Validator を使用してユーザー入力を検証しています。無効な要素の横に表示されるカスタム エラー アイコンをいつクリアする必要があるかを把握しようとしています。以下に投稿されたコードは、エラーアイコンを追加し続けます。showErrorsイベントでクリアしようとしましたが、うまくいきませんでした。

 $("#form1").validate({
                onfocusout: false,
                onKeyUp: false,

                rules: {

                 txtDate:{
                    required: true
                 },
                 txtType:{                   
                      required: true
                 },
                 ddlTime:{                   
                      required: true
                 }
               },
               messages: {
                ddlTime: {                   
                      required: "Please select an option for Time"
                 },
                 txtDate:{
                    required: "<br>Please enter valid date"
                 },
                 txtType: {                   
                      required: "<br>Please Enter valid type"
                 }
               },
               errorPlacement: function(error, element) {
                    error.wrap("<li></li>").appendTo($("#dvErrorSummary")); 
                    $('<div class="errorIcon"></div>').insertAfter(element);
                  }
             });

これは私のcssがどのように見えるかです:

label.error {
    color: red;
    font-style: italic
}

    .errors { color: red; }
    .errorIcon 
    { 
        background: url(../errorIcon.png); 
        width: 16px; 
        height: 16px;
        display:inline;

    }

これは私のHTMLがどのように見えるかです:

<body>
<html>
<head runat="server"></head>

        <form id="form1" runat="server">

            <ul id="dvErrorSummary" name="dvErrorSummary" class="errors"></ul>

             <select id="ddlTime" name="ddlTime" </select>
             <input id="txtDate" name="txtDate" />
             <input id="txtType" name="txtType" />

       </form>
</body>
</html>
4

2 に答える 2

1

これは、エラー メッセージ コンテナーを追加する部分です。

errorPlacement: function(error, element) {
                    error.wrap("<li></li>").appendTo($("#dvErrorSummary")); 
                    $('<div class="errorIcon"></div>').insertAfter(element);
                  }

length プロパティをチェックして、値が 1 未満の場合にのみ errorIcon を挿入できます。

于 2012-04-26T19:17:10.630 に答える
0

これは、この問題を解決するために私がしたことです:)

jQuery.extend(jQuery.validator.messages, {
    required: '<i class = "icon-exclamation-sign"></i>'
});

上記の方法を試してみましたが、ハッキングしすぎていたので、正しくないことに気付きました。お役に立てれば ：）

于 2013-09-25T06:11:01.583 に答える