ASP.Net MVC Datepicker ignore DataFormatString

Question

I have problem display the date in correct format from viewmodel and also the validation not work as well refer to the image

enter image description here .

As i've seen many post mentioned they managed to solved it without needed to set dateformat in client-side. So I NOT wish to set the date format in client-side which mean via jQueryUI datepicker or any method use to format in client-side. But no matter what i tried it seem not taking the format from the ViewModel.

And i knew this question had been posted long time in here, but nothing seem to work to me. Here are the list I had tried but none of them is work to me
Unable to set datetime format in MVC 4 using data annotations
-- Not sure why it's work as i tried date and datetime in data annotation

Validate DateFormat In Mvc
--> tried but still not work

Jquery dd/MM/yyyy date format validation --> is seem overkill to me to include jquery-ui-i18n.js and i don't want to set in client-side.

So anyone can advise what i've missed out? Or Can i say DataFormatString is completely useless without do extra work in client-side?

This is my viewModel

public class DateModel
{
    [Display(Name = "StartDate")]
    [DataType(DataType.Date)]
    [DisplayFormat(ApplyFormatInEditMode = true, DataFormatString = "{0:dd/MM/yy}")]
    public Nullable<DateTime> StartDate { get; set; }

    [Display(Name = "EndDate")]
    [DataType(DataType.DateTime)]
    [DisplayFormat(ApplyFormatInEditMode = true, DataFormatString = "{0:dd/MM/yy}")]
    public Nullable<DateTime> EndDate { get; set; }


}

My View

<div class='editor-field'>
    @Html.EditorFor(model => model.StartDate)
    @Html.ValidationMessageFor(model => model.StartDate)
</div>
<div class='editor-label'>
    @Html.LabelFor(model => model.EndDate)
</div>
<div class='editor-field'>
    @Html.EditorFor(model => model.EndDate)
    @Html.ValidationMessageFor(model => model.EndDate)
</div>

John Prado · Accepted Answer · 2014-04-23 06:55:12Z

0

You need to use a jquery globalize plugin in order to adjust the patterns of unobtrusive validation.

Install using nuget Install-Package jquery-globalize or donwload the plugin here.

Include the Globalize.js and ./cultures/globalize-culture[your-culture].js scripts in your bundle.

Use the javascript code bellow in your view or script file:

Globalize.culture("[your-culture]");
$.validator.methods.date = function(value, element) {
    return this.optional(element) || Globalize.parseDate(value);
};

answered Apr 23, 2014 at 6:55

John Prado

8048 silver badges19 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

tsohtan Over a year ago

hi, thanks for your answer, but i intend to find out why everyone out there mentioned DataFormatString can be used to set the date format but not work for me. and also as i mentioned above i do not want to solve this issue by adding more library into my solution.

John Prado Over a year ago

If you are using unobtrusive validation using a plugin is the only way I think you can solve the problem.

Collectives™ on Stack Overflow

ASP.Net MVC Datepicker ignore DataFormatString

1 Answer 1

2 Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

2 Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related