ASP.NET mVC 3.0验证MVCContrib CheckboxList

时间:2011-05-31 04:43:46

标签: validation asp.net-mvc-3 mvccontrib

我实现了一个自定义验证器来检查是否至少检查了一些东西:

public class AtLestOneRequiredAttribute : RequiredAttribute
    {
        public override bool IsValid(object value)
        {
            return (value != null);
        }
    }

    public class RequiredListValidator : DataAnnotationsModelValidator<AtLestOneRequiredAttribute>
    {
        private readonly string errorMessage;

        /// <summary>
        /// Initializes a new instance of the <see cref="EmailValidator"/> class.
        /// </summary>
        /// <param name="metadata">The metadata.</param>
        /// <param name="context">The context.</param>
        /// <param name="attribute">The attribute.</param>
        public RequiredListValidator(ModelMetadata metadata, ControllerContext context, AtLestOneRequiredAttribute attribute)
            : base(metadata, context, attribute)
        {
            this.errorMessage = attribute.ErrorMessage;
        }

        /// <summary>
        /// Retrieves a collection of client validation rules.
        /// </summary>
        /// <returns>A collection of client validation rules.</returns>
        public override IEnumerable<ModelClientValidationRule> GetClientValidationRules()
        {
            var rule = new ModelClientValidationRule
            {
                ErrorMessage = errorMessage,
                ValidationType = "atlestonerequired"
            };

            return new[] { rule };
        }        
    }

我还为该选择(http://weblogs.asp.net/srkirkland/archive/2011/03/08/adding-unobtrusive-validation-to-mvccontrib-fluent-html.aspx

生成不显眼的验证属性

型号:

[AtLestOneRequired(ErrorMessage="At least one selection required")]
        public IList<int> MyCheckBox{ get; set; }

查看:

@this.CheckBoxList(x => x.MyCheckBox).Options(Model.MyCheckBoxes).IncludeUnobtrusiveValidationAttributes(Html)

结果我得到了这个带有不显眼属性的html:

<div data-val="true" data-val-atlestonerequired="At least one selection required" id="MyCheckBox">
    <input id="MyCheckBox_0" name="MyCheckBox" type="checkbox" value="1"/>
    <label for="MyCheckBox_0" id="MyCheckBox_0_Label">A</label>
    <input id="MyCheckBox_1" name="MyCheckBox" type="checkbox" value="2"/>
    <label for="MyCheckBox_1" id="MyCheckBox_1_Label">B</label>
    <input id="MyCheckBox_2" name="MyCheckBox" type="checkbox" value="3"/>
    <label for="MyCheckBox_2" id="MyCheckBox_2_Label">C</label>
    <input id="MyCheckBox_3" name="MyCheckBox" type="checkbox" value="4"/>
    <label for="MyCheckBox_3" id="MyCheckBox_3_Label">D</label>
    ....
</div>

但是我的验证在客户端不起作用,我需要做些什么来使它工作?我想可能是我需要在这种情况下实现自定义jQuery validaton方法,如果默认情况下它不起作用?

尝试添加此内容:

jQuery.validator.addMethod("atlestonerequired", function (value, element) {
             return (value != null);
         });

         jQuery.validator.unobtrusive.adapters.addBool('atlestonerequired');

不起作用。

2 个答案:

答案 0 :(得分:1)

在这个问题上花了一些时间。 客户端验证不起作用的原因是不显眼的验证选择需要验证的项目。特别是以下一行:

$(selector).find(":input[data-val=true]").each(function () {
  $jQval.unobtrusive.parseElement(this, true);
});

如果您注意到“:输入”仅适用于input|select|textarea|button

这意味着您的"div[data-val=true]"将不会被选中。

解决这个问题的方法是执行类似于单选按钮所需的操作。

<div name="CheckBox" id="CheckBox">
  <input type="checkbox" data-val-cbrequired="Required" data-val="true" value="Default" name="CheckBox_0" id="CheckBox_0">
  <label for="CheckBox_0">Checkbox</label>
  <input type="checkbox" value="Yes" name="CheckBox_1" id="CheckBox_1">
  <label for="CheckBox_1">Yes</label>
  <input type="checkbox" value="No" name="CheckBox_2" id="CheckBox_2">
  <label for="CheckBox_2">No</label>
</div>

然后为Jquery验证添加:

$.validator.unobtrusive.adapters.addBool("cbrequired", "required");

答案 1 :(得分:0)

我不知道这个问题的公认解决方案。但这是一个解决它的方法。

我的复选框为:

<input name="TermsNConditions" type="checkbox" id="TermsNConditions" tabindex="12" />

该模型具有以下属性:

    [Required(ErrorMessage = "(Please accept the terms and conditions)")]
    [DefaultValue(0)]
    [RegularExpression(@"[^0]", ErrorMessage = "(Please accept the terms and conditions)")]
    public int AcceptTermsNConditions { get; set; }

和它的隐藏字段

<%:Html.HiddenFor(model=>model.AcceptTermsNConditions) %>

我在复选框上调用了一个javascript更改事件,如下所示:

$(function () {
        $("#TermsNConditions").live("change", function () {
            if ($("#TermsNConditions").attr('checked')) {
                $("#AcceptTermsNConditions").val(1);
            }
            else {
                $("#AcceptTermsNConditions").val(0);
            }
        });
        if ($("#AcceptTermsNConditions").val() == 1) {
            $("#TermsNConditions").attr('checked', true);
        }
    });

上述脚本设置隐藏字段的值,并根据该隐藏字段验证模型。