0

最新の jQuery ライブラリと jquery 検証プラグインを使用して、フォームを検証しています。

フッターに検証するフォームを配置しました。エラーメッセージが表示されるとすぐに、フッターがアニメーション化されて引き伸ばされます。検証は問題なく機能しますが、errorPlacement がまったく呼び出されないだけです。また、(ここではjQuery Validation errorPlacement )、validate() には既に errorPlacement のデフォルト アクションがあり、これを上書きする必要があることも読みました。(次のコードを使用すると、メッセージが表示されなくなると思いますよね?

私は試しました（もちろん、他の要素（メッセージ/ルール）でも）：

$(document).ready(function(){  //.ready -> steht erst nach dem Laden des DOMs zur Verfügung
 $("#nlForm").validate({

 debug: true,
 onfocusout: false,
 onKeyUp: false,
 errorLabelContainer: $("#results"),
 wrapper: "li", //wrapping the errormessages in <li>

 rules: { }, 
 messages: { },

 errorPlacement: function( ) {
    $("#footer").animate({
    height: "300px",
 }, 1500 );
 },

 submitHandler: function(form) {
    $('#results').css('display', 'none') //hides my results-div in the beginning

    $("#footer").animate({
      height: "300px",
    }, 1500 );

    var docHeight = $(document).height(); 
    var windowHeight = $(window).height(); 
    var footerheight = 70; //additional pixels of stretched footer
    var scrollPos = docHeight - windowHeight + footerheight; 

    $('html, body').animate({ //scrolling down
       scrollTop: scrollPos+'px'
    }, 1500);

    $.post('/process.php', $("#nlForm").serialize(), function(data) {
       $('#results').html(data); 
    });

 $('#results').fadeIn(1500); //fades in my results-div

 }
 });
});

エラーは発生しませんが、アニメーションもしません。errorPlacement 関数が呼び出されない理由がわかりません。（私も追加しようとしました

document.write('hi there')

関数が呼び出されるかどうかを確認してください。しかし、そうではありません...

誰かが機能している簡単な例を投稿できれば、本当にうれしいです。または、私が変更できることを教えてください...

さらに、エラーの外観もアニメーション化する予定です。これをどのように達成できるか考えていますか? results-div で生成されようとしている label-object を取得する必要があります。どうすればそれに対処できますか？

もうありがとう

乾杯

（ところで、最初に間違った場所に投稿してしまってすみません..）

-------残念ながら、まだ回答を投稿できないため、投稿を編集する必要があります------- 回答:

ご回答有難うございます; 1に。私はちょうどそれらを省略したことを知っています..

rules: {
        nlName: {
            rangelength: [3, 25], // muss zwischen 3 und 25 zeichen lang sein.
            required: true,
            notName: true,
        },
        nlEmail: {
            required: true,
            email: true,  //has to be a valid email, returns true if so.
        }
    }, //ohne Komma gehts nicht...
    messages: {
        nlName: {
   required: "Bitten geben Sie einen Namen ein",
   notName: "Ihr Name lautet nicht 'Name'!",
   rangelength: "Ihr Name muss zwischen 3 und 25 Zeichen lang sein.",
    },
        nlEmail: "Ihre Emailadresse scheint ungültig zu sein",
    },

主にドイツ語であり、この部分はうまく機能するためです。「形が整っている」の意味がわかりませんか？どこにもエラーを配置するコードがないということですか? それは本当です、私は今までそれをしませんでした。私は通常のメッセージ表示方法でそれを作りました。しかし、私のエラーがまだ表示されているということは、私の errorPlacement が適切に呼び出されていないことを示していますね。

submitHandler が呼び出されるのは、すべてが問題ない場合のみであることは明らかです。アニメーションを2回だけ行います。1 回は、私の process.php によって生成された最終メッセージ「successful subscripion blabla, generated by my process.php」を表示する場所を確保し、1 回はエラーを表示する必要がある場合にのみ...

さて、私は間違いなくこのinvalidHandlerを見ていきます。今のところThx。

4

1 に答える 1

1

あなたのコードで次の 2 つのことに気付きました。

  1. ルールとメッセージが空です。
  2. errorPlacement の形式は次のとおりです。オブジェクトを表示するには、オブジェクトをページのどこかにfunction(error, element) { }配置する必要があります。errorこのメソッドはフォームのエラーごとに呼び出されるため、これはあなたが達成しようとしているものではないと思います。

オプションを使用することをお勧めしinvalidHandlerます。これにより、フォームに検証エラーがある場合にアニメーションを実行できます。

編集:注:フォームに検証エラーがない場合にsubmitHandler呼び出されます。

于 2011-12-29T16:01:51.607 に答える