1

私はたくさん検索しましたが、まだ理解していません...さまざまなエラーメッセージを関連フィールドの近くで強調表示するのではなく、単一のボックス (div) に渡すにはどうすればよいですか。たとえば、4 つの必須フィールドがあり、それらのカスタム メッセージがあるとします。

<script>
// validation
(function($,W,D)
{
    var JQUERY4U = {};
    JQUERY4U.UTIL =
    {
        setupFormValidation: function()
        {
            //form validation rules
            $("#register-form").validate({
                validClass: "valid",
                errorContainer: $("#error-note"),
                errorLabelContainer: $([]),
                rules: {
                    name: "required",
                    email: {
                        required: true,
                        email: true
                    },
                    birthdate: "required",
                    eua: "required"
                },
                messages: {
                    name: "Name is required",
                    email: "Please, enter your email",
                    birthdate: "We need to know your date of birth",
                    eua: "Please check the checkbox..."
                },
                submitHandler: function(form) {
                    form.submit();
                }
            });
        }
    }
    //when the dom has loaded setup form validation rules
    $(D).ready(function($) {
        JQUERY4U.UTIL.setupFormValidation();
    });
})(jQuery, window, document);
</script>

#error-noteエラーメッセージ出力（印刷）のすべて/一部を取得する必要があるすべてのフィールドの直前のdivです。しかし、エラーメッセージは相対フィールドに「組み込まれています」（私は必要ありません）。それを達成する方法はありますか？

http://bassistance.de/jquery-plugins/jquery-plugin-validation/

4

1 に答える 1

10

SOリーダーの利益のために投稿された回答。

ドキュメントのサンプルコードによると、これは本当に簡単です。

$(document).ready(function () {

    $('#myform').validate({ 
        // rules and other options,
        errorLabelContainer: "#error-note",
        wrapper: "li"
    });

});

<div id="error-note"></div>また、HTML レイアウト内に配置する必要があります。

動作デモ: http://jsfiddle.net/6kxSp/

注:

1）OPは単にコンテナを混同しました。 errorContainer:2 番目のオプションのコンテナーです。 errorLabelContainerエラーリストを含む単一のボックスには十分です。

2) これは意味がありません: errorLabelContainer: $([]). OP がdocs のサンプル コードを読んだ場合、彼は自分が達成しようとしていたことを打ち負かしただけであることがわかります。 $([])有効な jQuery セレクターでさえありません。

3) これは不必要で冗長です。

submitHandler: function(form) {
   form.submit();
}

docs に従って、submitHandlerコールバック関数は検証後にフォームを自動的に送信します。ここに電話する必要はありませんsubmit()。

4) docs によると、これはデフォルトであり、宣言する必要はありません...

validClass: "valid"

5) このようにすべてをまとめるのは、余計で、不必要で、冗長で、難解です...

(function($,W,D)
{
    var JQUERY4U = {};
    JQUERY4U.UTIL =
    {
        setupFormValidation: function()
        {
            $("#register-form").validate({ .... });
        }
    }

    $(D).ready(function($) {
        JQUERY4U.UTIL.setupFormValidation();
    });

})(jQuery, window, document);

ガイダンスを求める人々に混乱をもたらす以外に、有益な目的はありません。 これは、 Sam Deering による人気があるが説明が不十分なオンライン デモ/チュートリアルからのもので、多くの場所にリンクされています。IMO、jQuery/JavaScript の専門家を装う場合は、少なくとも JavaScript で一般的に見られるコード書式設定スタイルを使用してください。PHP で使用されるスタイル (Allman) ではありません。コードのフォーマット スタイルがどのようなものであっても、少なくとも一貫して使用してください。

他の jQuery プラグインとまったく同じように、メソッドを DOM 対応のイベント ハンドラー内にラップするだけ.validate()で、このプラグインを適切に初期化することができます。

$(document).ready(function() {

    $("#register-form").validate({
        // any rules, options and callbacks
    })

});
于 2013-04-11T15:55:02.900 に答える