0

jQuery 検証をトリガーするボタンがあります。検証が失敗した場合、ボタンはフェードアウトして、ボタンから検証メッセージに注意を引き付けるのに役立ちます。

$('#prev,#next').click(function (e)
{
    var qform = $('form');
    $.validator.unobtrusive.parse(qform);
    if (qform.valid())
    {
        // Do stuff then submit the form
    }
    else
    {
        $('#prev').fadeTo(500, 0.6);
        $('#next').fadeTo(500, 0.6);
    }

その部分はうまく機能します。

ただ、無効条件をクリアしたらボタンのフェードを解除したいです。

jQuery Validation にフックして適切なイベントを取得することは可能ですか (ユーザーがボタンをクリックする必要はありません)。どのように？

アップデート

@Darinの回答に基づいて、jquery-validationプロジェクトで次のチケットを開きました

https://github.com/jzaefferer/jquery-validation/issues/459

4

2 に答える 2

2

奇妙に聞こえるかもしれませんが、jQuery.validate プラグインにはグローバルな成功ハンドラーがありません。成功ハンドラーがありますが、これはフィールドごとに呼び出されます。プラグインを変更してそのようなハンドラーを追加できる次のスレッドを見てください。変更後のプラグインは次のようになります。

numberOfInvalids: function () {
    /* 
    * Modification starts here...
    * Nirmal R Poudyal aka nicholasnet
    */
    if (this.objectLength(this.invalid) === 0) {
        if (this.validTrack === false) {
            if (this.settings.validHandler) {
                this.settings.validHandler();
            }
            this.validTrack = true;
        } else {
            this.validTrack = false;
        }
    }
    //End of modification 

    return this.objectLength(this.invalid);
},

これで、コードでこのイベントをサブスクライブするのは簡単です。

$(function () {
    $('form').data('validator').settings.validHandler = function () {
        // the form is valid => do your fade ins here
    };
});

ところで、フォームに添付されたデータを$.validator.unobtrusive.parse(qform);上書きし、購読している を強制終了する可能性のあるメソッドを呼び出しているようです。この場合、.parse メソッドを呼び出した後、.parse メソッドも再アタッチする必要があるかもしれません (テストはしていませんが、必要かもしれないと感じています)。validatorvalidHandlervalidHandler

于 2012-07-04T20:00:27.987 に答える
1

同様の問題に遭遇しました。私のようにソースを変更するのをためらっている場合は、jQuery.fn.addClass メソッドにフックするという別のオプションがあります。jQuery Validate は、そのメソッドを使用して、要素が正常に検証されるたびにクラス "valid" を要素に追加します。

(function () {
    var originalAddClass = jQuery.fn.addClass;
    jQuery.fn.addClass = function () {        
        var result = originalAddClass.apply(this, arguments);
        if (arguments[0] == "valid") {
            // Check if form is valid, and if it is fade in buttons.
            // this contains the element validated.
        }
        return result;
    };
})();

はるかに優れた解決策を見つけましたが、目立たないバリアントで同じオプションを使用できるかどうかはわからないため、シナリオで機能するかどうかはわかりません。しかし、これは私が最終的に標準のバリアントでそれを行った方法です。

$("#form").validate({
    unhighlight: function (element) {
        // Check if form is valid, and if it is fade in buttons.
    }
});
于 2012-07-11T19:39:39.447 に答える