0

関連:パラメーターを使用したASP.NETMVC3クライアント側の検証

相対的な日付を確認できるカスタム検証属性を作成しました(例:Today以下のモデル値)。

GetClientValidationRulesバリデーターはメソッドを正しく実装し、ビューで出力されたHTML5は私には正しいように見えます。

<div class="editor-label">
    <label for="Date">Date</label>
</div>
<div class="editor-field">
    <input class="text-box single-line" data-val="true" data-val-date="The field Date must be a date." data-val-relativedate="Date must be less than or equal to 12/04/2012" data-val-relativedate-referencedate="12/04/2012 00:00:00" data-val-relativedate-relativityoperator="lessThanOrEqual" data-val-required="The Date field is required." id="Date" name="Date" type="date" value="" />
    <span class="field-validation-valid" data-valmsg-for="Date" data-valmsg-replace="true"></span>
</div>

次のステップは、カスタムjQueryUnobtrusiveValidatorアダプターとメソッドを定義することでした。

// Validation Method: Relative Date
// Note: method name value does NOT need to match the HTML5 metadata built by the server model annotation attribute.
$.validator.addMethod("validateRelativeDate", function (value, element, params) {
    // "element" is the actual HTML element we are validating, and is unneeded here.
    // "value" is the value of the HTML element
    var toValidate = DateUtilities.convert(value);
    // "params" is a JSON collection of those values provided by the adapter.
    var referenceDate = params["referencedate"];
    var relativityOperator = params["relativityoperator"];

    if (relativityOperator != "lessThan" && relativityOperator != "lessThanOrEqual" || relativityOperator != "greaterThan" && relativityOperator != "greaterThanOrEqual")
        return false; // "Invalid relativity operator (ex. '<', '<=', '>', or '>=').");

    var toReference = referenceDate == null ? new Date() : referenceDate;

    var relativity = DateUtilities.compare(toValidate, toReference);

    switch(relativityOperator) {
        case "lessThan":
            if (relativity >= 0) return false; //"Date must be lesser than " + toReference);
        break;
        case "lessThanOrEqual":
            if (relativity > 0) return false; //"Date must be less than or equal to " + toReference);
        break;
        case "greaterThan":
            if (relativity <= 0) return false; //"Date must be greater than " + toReference);
        break;
        case "greaterThanOrEqual":
            if (relativity < 0) return false; //"Date must be greater than or equal to " + toReference);
        break;
    }

    return true;

});

// note: adapter name must match HTML metadata built by the server model annotation attribute
$.validator.unobtrusive.adapters.add("relativedate", ["referencedate", "relativityoperator"], function (options) {
    options.rules["relativedate"] = options.params;
    options.messages["relativedate"] = options.message;
});

症状

日付の検証が壊れています。必須は正常に動作しているようです。しかし、このフィールドに値を入力すると、Date型バリデーターがトリガーされ、「フィールドDateは日付である必要があります」というメッセージが生成されます。これは、入力されたすべての日付値に対して発生します。

質問

(1)機能せず、(2)日付型の検証を妨害するという私の検証ルールの何が問題になっていますか?

4

1 に答える 1

2

ほとんどのデバッグ経験と同様に、症状は何が起こっているかとは何の関係もありませんでした。必須と日付型の両方の検証が成功しました。アダプターで障害が発生しました。

説明

ブラウザスクリプトデバッガを使用すると、次の行で失敗することがわかりました。

// jQuery.validate.js, line 530
result = $.validator.methods[method].call( this, val, element, rule.parameters );

これは、jQueryが検証のためにルールとそれに関連するメソッドをループする場所です。

method"relativedate"次には(HTML5で吐き出されたメタデータ値)に等しいため、callプロパティは例外をスローしていました。メソッドに別の名前を付けまし$.validator.addMethod("validateRelativeDate", /*...*/)たが、ドキュメントには、このメタデータ値と一致する必要はないと記載されていました...では、なぜこれが発生したのでしょうか。

それはアダプターです。アダプター名はHTML5メタデータと同じである必要があることを私は知っていました。これは、2つの間の緊密な結合です-したがって、以下に"relativedate"示されています。

//注:アダプター名は、サーバーモデルのアノテーション属性によって作成されたHTMLメタデータと一致する必要があります$ .validator.unobtrusive.adapters.add( "relativedate"、["referencedate"、 "relativityoperator"]、function(options){options.rules [ "relativedate"] = options.params; options.messages ["relativedate"] = options.message;});

rulesとの配列値を追加する2行messagesが原因でした。明らかに、これらの値は、アダプター/メタデータの名前ではなく、検証に使用されるメソッドの名前である必要があります。

解決

検証メソッド名に一致するようにこれらの2行を変更して、すべてを解決しました。

options.rules["validateRelativeDate"] = options.params;
options.messages["validateRelativeDate"] = options.message;

言い訳、言い訳...

私が調査したすべての例、および私が参照した例でさえ、これらの値はすべて等しいため、この詳細については説明しませんでした。しかし、最終的には、これがHTML5のがらくたを検証方法に「適応」させる唯一の方法であることに気づかなかったのは、私が少し不器用なプログラマーだったことを意味します。

うまくいけば、これは誰かを助けたり、時間を節約したりします。

于 2012-12-04T20:44:45.180 に答える