ASP.Net MVC不显眼的日期范围验证

时间:2013-10-09 19:10:07

标签: asp.net-mvc validation date data-annotations

我有一个包含两个日期字段的表单,即开始日期和结束日期。我想验证这两个字段以确保开始日期在结束日期之前或之前。我编写了一个远程验证器并将其分配给两个字段,但这可能会导致同一错误的多条消息。此外,如果我更正了一个日期,则验证不会在未修改的字段上触发,并留下旧的错误消息

如何相互验证两个日期字段以验证开始日期是在结束日期之前还是结束日期?

1 个答案:

答案 0 :(得分:2)

几周前我遇到了同样的问题。恕我直言,我认为解决问题的最佳方法是使用jquery实现客户端控制。 通过这种方式,您可以在每次更改StartDate或EndDate上的值时调用验证。在这种情况下,最好是调用服务器来验证客户端上的数据,因为您没有调用服务器。

在以下链接中,有一个实现客户端验证的过程。 Link

这是我的解决方案:

步骤1:创建属性类以验证连续日期

public class ConsecutiveDateAttribute : ValidationAttribute, IClientValidatable
{
    public ConsecutiveDateAttribute()
    {
        ErrorMessage = "The date must be consecutive";
    }

    public override bool IsValid(object value)
    {
        return true;
    }

    public IEnumerable<ModelClientValidationRule> GetClientValidationRules(ModelMetadata metadata, ControllerContext context)
    {
        var rule = new ModelClientValidationRule();
        rule.ErrorMessage = FormatErrorMessage(metadata.GetDisplayName());
        rule.ValidationParameters.Add("datefield", metadata.PropertyName);
        rule.ValidationType = "consecutivedate";
        yield return rule;
    }
}

IsValid方法总是返回true,因为我想验证客户端的值。 GetClientValidationRules函数用于向cshtml页面传递两个字段名称和事件验证名称,以便为每个字段调用验证。

步骤2:使用属性ConsecutiveDate装饰我要验证的字段

    [Required(), DataType(DataType.Date), ConsecutiveDate()]
    public DateTime StartDate { get; set; }

    [Required(), DataType(DataType.Date), ConsecutiveDate()]
    public DateTime EndDate { get; set; }

第3步:在页面中实现javascript以验证日期

<script src="@Url.Content("~/Scripts/jquery-1.10.2.js")" type="text/javascript" />
<script src="@Url.Content("~/Scripts/jquery.validate.js")" type="text/javascript" />
<script src="@Url.Content("~/Scripts/jquery.validate.unobtrusive.js")" type="text/javascript"></script>

<script type="text/javascript">

    if ($.validator && $.validator.unobtrusive) {

        $.validator.unobtrusive.adapters.addSingleVal("consecutivedate", "datefield");

        $.validator.addMethod("consecutivedate", function(value, element) {

            if ($("#StartDate").val() != "" && $("#EndDate").val() != "")
                return $("#StartDate").val() <= $("#EndDate").val();

            // IF both values are not polupated I don't want to validate the field
            return true;
        });

    }
</script>

$。validator.addMethod(“consecutivedate”,function(value,element):这会为我要验证的每个字段注册验证。