CODEWITHSUNDEEP
javascriptjqueryasp.netasp.net-mvcdatepicker
Dan Wray
Dan Wray

Reputation: 699

ASP.Net MVC jQuery UI DatePicker Date Format

I'm at my wits end trying to force this jQuery datepicker control to understand specific date formats. What the hell is going on here?

View

@Html.TextBoxFor(model => model.StartDate, "{0:dd/MM/yyyy}", new { @class = "datefield" })

Javascript

$(function () {
    $(".datefield").datepicker({
        dateFormat: 'dd/MM/yyyy',
        showOn: "button"
    });
});

On page load

On page load

datepicker clicked, so far so good

datepicker clicked

date selected... what?

date selected

Upvotes: 3

Views: 9687

Answers (2)

David
David

Reputation: 219057

According to the documentation:

  • dd - day of month (two digit)
  • MM - month name long
  • yy - year (four digit)

So dd/MM/yyyy should produce that result. (The day, the long month name, and the 4-digit year twice.) To match your initially loaded format, you'd want this:

dd/mm/yy

Upvotes: 6

Andrei V
Andrei V

Reputation: 7508

You need to set it like this:

$(function () {
    $(".datefield").datepicker({
        dateFormat: 'dd/mm/yy',
        showOn: "button"
    });
});

As noted in the documentation, the yy format specifies a 4 digit year. When you write yyyy you are basically telling it to render the year twice. Relating to the month, jQuery associates MM (capital letters) with the name of the month and mm with the corresponding digit form.

In conclusion, the date formats differ between .Net and jQueryUI.

Upvotes: 5

Related Questions