asp.net-mvc - asp.net mvc 3 上时间跨度的客户端验证

Question

我需要接收一些格式为“hh:mm”(无秒数)的时间信息。该属性定义如下:

[DataType(DataType.Time), DisplayFormat(ApplyFormatInEditMode = true, DataFormatString = @"{0:hh\:mm}")]
public TimeSpan SomeTimeProperty { get; set; }

服务器端验证按预期工作。但是，我无法获得客户端验证工作，因为没有生成客户端验证规则。

我怎样才能让它发挥作用？

Answer 1

恐怕您需要走很长的路并为其创建自定义验证器属性。

public class TimeSpanValidationAttribute : ValidationAttribute, IClientValidatable
{
    public bool IsValid() {
        // Your IsValid() implementation here
    }

    // IClientValidatable implementation
    public IEnumerable<ModelClientValidationRule> GetClientValidationRules(ModelMetadata metadata, ControllerContext context)
    {
        var rule = new TimeSpanValidationRule("Please specify a valid timespan (hh:mm)", "hh:mm");
        yield return rule;
    }
}

然后需要编写TimeSpanValidationRule类:

public class TimeSpanValidationRule : ModelClientValidationRule
{
    public TimeSpanValidationRule(string error, string format)
    {
        ErrorMessage = error;
        ValidationType = "timespan";
        ValidationParameters.Add("format", format);
    }
}

这足以让 Html Helper 生成一个 data-val-timespan="Please specify a valid timespan (hh:mm)" 和一个 data-val-timespan-format ="hh:mm" 为html输入框。

这两个值可以通过将适配器添加到 javascript 对“timespan”属性的不显眼验证来“收获”。然后它将通过其相应的规则(将模仿服务器端规则)进行验证:

$.validator.unobtrusive.adapters.add('timespan', ['format'], function (options) {
    options.rules['timespan'] = {
        format: options.params.format //options.params picked up the extra data-val- params you propagated form the ValidationRule. We are adding them to the rules array.
    };
    if (options.message) { // options.message picked up the message defined in the Rule above
        options.messages['timespan'] = options.message; // we add it to the global messages
    }
});

$.validator.addMethod("timespan", function (value, el, params) {
    // parse the value and return false if not valid and true if valid :)
    // params.format is the format parameter coming from the ValidationRule: "hh:mm" in our case
});