0

ASP.Net MVC プロジェクトに、qTip2 を使用して検証エラーを表示するフォームがあります。そのフォームには、ラジオ ボタンでの選択に応じてアクティブ化/非アクティブ化されるテキスト フィールドもあります。フィールドを使用しない場合は、disabled="disabled" プロパティを設定します。これにより、これらのフィールドのクライアント側の検証 (jQuery の控えめな検証) も無効になります。今、無効になったフィールドのqTip2「バブル」をリセットする方法を考えています。

テキスト ボックス A と B をそれぞれ有効にするラジオ ボタン 1 と 2 があるとします。また、ラジオ ボタン 1 がデフォルトで選択されており、対応するラジオ ボタンが選択されている場合、テキスト ボックス A と B が必須フィールドであるとします。テキスト フィールドに入力せずに送信ボタンを押すと、テキスト ボックス A の横に qTip エラー バブルが表示されます。ここで、ラジオ ボタン 2 を押すと、そのバブルをクリアし、テキスト ボックス A とその検証を無効にし、有効にする必要があります。テキストボックス B とその検証。ただし、この時点でテキスト ボックス B に入力せずに送信を押すと、エラー バブルは表示されず、フォームは送信されません。

これを達成するために、次のコマンドのさまざまな組み合わせを試しましたが、検証エラーは完全に無効になります。

$('.qtip').remove();
$('.qtip').hide();
$("input.input-validation-error").removeClass("input-validation-error"); // watch out for the error message labels or they won't go away
$('form').data('validator').resetForm();
$("form").validate().form();

ラジオボタンがクリックされ、適切なテキストボックスが無効/有効になった後にこれらのコマンドのどのような組み合わせを実行しても、qTip バブルは消えますが、[送信] ボタンをクリックしても再び表示されることはなく、フォームに他のエラーが表示されるはずです。 .

おそらく、正しいコマンドを使用して qTip 検証バブルをリセットしていません。

4

1 に答える 1

0

質問を投稿した直後に解決策を見つけました。このページhttp://johnculviner.com/?tag=/unobtrusive-validation-resetで提案されている、少し変更したソリューションを使用しました。次の行を追加しました:$ form.find('input')。qtip('destroy');

それはこれを与えます:

//Taken from: http://johnculviner.com/?tag=/unobtrusive-validation-reset
(function ($) {
    $.fn.resetValidation = function () {
        var $form = this.closest('form');

        //Destroy qTip error bubbles (http://craigsworks.com/projects/forums/thread-using-qtip-with-jquery-validation-framework)
        //$form.find('input:not(.errormessage)').qtip('destroy');
        $form.find('input').qtip('destroy');

        //reset jQuery Validate's internals
        $form.validate().resetForm();

        //reset unobtrusive validation summary, if it exists
        $form.find("[data-valmsg-summary=true]")
            .removeClass("validation-summary-errors")
            .addClass("validation-summary-valid")
            .find("ul").empty();

        //reset unobtrusive field level, if it exists
        $form.find("[data-valmsg-replace]")
            .removeClass("field-validation-error")
            .addClass("field-validation-valid")
            .empty();

        return $form;
    };

    //reset a form given a jQuery selected form or a child
    //by default validation is also reset
    $.fn.formReset = function (resetValidation) {
        var $form = this.closest('form');

        $form[0].reset();

        if (resetValidation == undefined || resetValidation) {
            $form.resetValidation();
        }

        return $form;
    }
})(jQuery);

次に、ラジオボタンがクリックされたら、$( "form")。resetValidation();を呼び出します。適切なフィールドが有効化/無効化された後。

于 2012-09-08T00:19:03.420 に答える