Validate DateFormat In Mvc

问题:

I have a property ExpiredDate define in MVC

[Required]
        [DisplayFormat(DataFormatString = "{0:MM/dd/yyyy}")]
        public DateTime? ExpirationDate { get; set; }

I want to Validate if Date on a page is not in correct format. The format of date I am using is MM/dd/yyyy.

回答1:

You should use the DataType attribute with DataType.Date. Both of which are in the System.ComponentModel.DataAnnotations namespace and can be used like this:

[Required]
[DataType(DataType.Date)]
[DisplayFormat(DataFormatString = "{0:MM/dd/yyyy}")]
public DateTime? ExpirationDate { get; set; }

This answer also includes some more attributes.

Update: To enable client-side validation in ASP.NET MVC4, you need to do this:

1. Add the jquery.validation plugin to the footer

   <%: Scripts.Render("~/Scripts/jquery.validate.min.js") %>
   <%: Scripts.Render("~/Scripts/jquery.validate.unobtrusive.min.js") %>
   

2. Add this to web.config

   <appSettings>
     <add key="ClientValidationEnabled" value="true" />
     <add key="UnobtrusiveJavaScriptEnabled" value="true" />
   </appSettings>
   

3. Use this css when using @Html.ValidationMessageFor() so that it is initially hidden and displays via the javascript validation

   /* styles for validation helpers */
   .field-validation-error {
       color: #e80c20;
       font-weight: bold;
   }
   
   .field-validation-valid {
       display: none;
   }
   
   input.input-validation-error {
       border: 1px solid #e80c20;
   }
   
   input[type="checkbox"].input-validation-error {
       border: 0 none;
   }
   
   .validation-summary-errors {
       color: #e80c20;
       font-weight: bold;
       font-size: 1.1em;
   }
   
   .validation-summary-valid {
       display: none;
   }
   

回答2:

Custom validation date format must be solved manually.

Client validation issues can occur because of MVC bug (even in MVC 5) in jquery.validate.unobtrusive.min.js which does not accept date/datetime format in any way. It is not caused by datepicker nor browsers. Unfortunately you have to solve it manually.

My finally working solution:

You have to include before:

@Scripts.Render("~/Scripts/jquery-3.1.1.js")
@Scripts.Render("~/Scripts/jquery.validate.min.js")
@Scripts.Render("~/Scripts/jquery.validate.unobtrusive.min.js")
@Scripts.Render("~/Scripts/moment.js")

You can install moment.js using:

Install-Package Moment.js

And then you can finally add fix for date format parser:

$(function () {
    $.validator.methods.date = function (value, element) {
        return this.optional(element) || moment(value, "DD.MM.YYYY", true).isValid();
    }
});

回答3:

You can use validation like:

[Required]
        [DisplayFormat(DataFormatString = "{0:d}")]
        public DateTime? ExpirationDate { get; set; }

I think it will work