DateEdit doesn't work with custom date format

Question

I have this model:

[ModelBinder(typeof(DevExpressEditorsBinder))]
public class RegisterViewModel
{
    [Required]
    [DataType(DataType.Date)]
    [Display(Name = "Дата рождения"), DisplayFormat(DataFormatString = "{0:dd.MM.yyyy}", ApplyFormatInEditMode = true)]
    public DateTime Birthdate { get; set; }
}

And view code:

@*Html.EditorFor(s => s.Birthdate)*@
@Html.DevExpress().DateEditFor(s => s.Birthdate, settings =>
{
    settings.Properties.DisplayFormatString = "dd.MM.yyyy";
    settings.Properties.EditFormatString = "dd.MM.yyyy";
}).GetHtml()

The first variant (that's commented) works perfectly but I need to use DevExpress. And DevExpress DateEdit sends the correct value only if I set the MM.dd.yyyy format everywhere. Else, the validator output:

The field Birthdate must be a date.

How can I fix this issue?

The issue is related to `jquery.validate.js` which validates dates based on the `MM/dd/yyyy` format (refer [this answer](http://stackoverflow.com/questions/39677035/date-of-birth-validation-keeps-showing/39682410#39682410) for an explanation). I'm not familiar, but I assume `DateEditFor()` has a method to parse the date so that you could use a solution similar to [this answer](http://stackoverflow.com/questions/27285458/jquery-ui-datepicker-and-mvc-view-model-type-datetime/27286969#27286969) — , Sep 29 '16 at 12:06
Of course, it has. But I didn't know how to set it for DX DateEdit. — Denis Sologub, Sep 29 '16 at 12:29
And thank you for explanation, I didn't know about `validate`. — Denis Sologub, Sep 29 '16 at 12:30

score 0 · Answer 1 · answered Oct 28 '16 at 10:06

According to DateEdit documentation, you may set custom edit formatting to DateEditFor using EditFormat.Custom shown below:

@Html.DevExpress().DateEditFor(s => s.Birthdate, settings =>
{
    settings.Properties.DisplayFormatString = "dd.MM.yyyy";
    settings.Properties.EditFormat = EditFormat.Custom; // add this line
    settings.Properties.EditFormatString = "dd.MM.yyyy";
}).GetHtml()

As @Stephen said, DX extensions client-side validation based on jQuery bundle, which requires jquery.validate.js and jquery.validate.unobtrusive.min.js to be loaded on Layout page or view page. Hence, you can use either built-in validation or remote validation to check date format regarding to EditFormatString property (see references below).

Validation references:

Built-in Validation

Remote Validation

Related problem with similar date format:

DateEdit - Bind to a nullable property

DateEdit doesn't work with custom date format

1 Answers1