2

私がこれについて見た他のいくつかの投稿があります：

チェックボックスのMVCの目立たない検証が機能しない

MVC3：jQueryを介してチェックボックスを必須にする検証しますか？

しかし、私はそれらを実装しましたが、検証が正しく機能しない理由を完全に理解することはできません。

属性：

[AttributeUsage(AttributeTargets.Field | AttributeTargets.Property, AllowMultiple = false, Inherited = true)]
    public sealed class MustBeTrueAttribute : ValidationAttribute, IClientValidatable {
        public override bool IsValid(object value) {
            return value != null && (bool)value;
        }

        public override string FormatErrorMessage(string name) {
            return string.Format("The {0} field must be true.", name);
        }

        #region Implementation of IClientValidatable

        public IEnumerable<ModelClientValidationRule> GetClientValidationRules(ModelMetadata metadata, ControllerContext context) {
            yield return new ModelClientValidationRule {
                ErrorMessage = string.IsNullOrEmpty(ErrorMessage) ? FormatErrorMessage(metadata.DisplayName) : ErrorMessage,
                ValidationType = "mustbetrue"
            };
        }

        #endregion
    }

アダプター拡張：

// Unobtrusive validation extras
$.validator.unobtrusive.adapters.addBool("mustbetrue", function (options) {
    //b-required for checkboxes
    if (options.element.tagName.toUpperCase() == "INPUT" && options.element.type.toUpperCase() == "CHECKBOX") {
        options.rules["required"] = true;
        if (options.message) {
            options.messages["required"] = options.message;
        }
    }
});

モデルプロパティ：

    [Display(Name = "I agree to RustyShark's Terms of Use")]
    [MustBeTrueAttribute(ErrorMessage = "You must agree to the Terms of Use")]
    public bool AgreeToTerms { get; set; }

意見：

<div class="formField">
    <div class="label">
        @Html.LabelFor(m => m.AgreeToTerms); @Html.ActionLink("view here", "TermsOfUse", "Home", null, new { target = "_blank" }).
    </div>
    <div class="input">
        @Html.CheckBoxFor(m => m.AgreeToTerms)
    </div>
    @Html.ValidationMessageFor(m => m.AgreeToTerms)
</div>

次のHTMLがレンダリングされます。

<div class="formField">
    <div class="label">
        <label for="AgreeToTerms">I agree to RustyShark's Terms of Use</label>; <a href="/Home/TermsOfUse" target="_blank">view here</a>.
    </div>
    <div class="input">
        <input data-val="true" data-val-mustbetrue="You must agree to the Terms of Use" data-val-required="The I agree to RustyShark&amp;#39;s Terms of Use field is required." id="AgreeToTerms" name="AgreeToTerms" type="checkbox" value="true" class="valid"><input name="AgreeToTerms" type="hidden" value="false">
    </div>
    <span class="field-validation-valid" data-valmsg-for="AgreeToTerms" data-valmsg-replace="true"></span>
</div>

サーバー側の検証は機能していますが（オーバーライドされたエラーメッセージではなく、デフォルトのエラーメッセージが返されます）、クライアント側は機能していません-メッセージが返されませんが、すべてが正しく実行されていますか？誰かが私の問題を見ることができますか？

4

1 に答える 1

4

ついにそれを理解しました！

主な問題は、$（document）.ready（）関数内で$.validatorメソッドを実行していたことでした。インライン関数として実行する必要があります！それらをready（）の外に移動したところ、物事が起こり始めました！

さらに、JSは次のように読み取る必要があります。

$.validator.addMethod("mustbetrue", function (value, element, params) {
    return value == true;
});
$.validator.unobtrusive.adapters.add("mustbetrue", function (options) {
    if (options.element.tagName.toUpperCase() == "INPUT" && options.element.type.toUpperCase() == "CHECKBOX") {
        options.rules["required"] = true;
        if (options.message) {
            options.messages["required"] = options.message;
        }
    }
});
于 2012-05-31T18:46:19.290 に答える