datetime jquery plugin - format date headache

Question

I have viewmodel with property

public DateTime StartTime { get; set; }

I want to apply jquery datetime plugin to that property

Problem is that I cannot force jquery plugin to format date in format

dd.mm.yy HH:mm:ss

which should represent

01.01.1999 00:00:00

How should I decorate DateTime prooperty inside model to match this format in jquery plugin?

update: I tried following:

$(document).ready(function () {
            $('.dateTimePicker').datetimepicker({                           
               timeFormat: "HH:mm:ss",
               dateFormat: 'dd.mm.yy',
            });
});

and inside model to decorate property

[DisplayFormat(ApplyFormatInEditMode = false, DataFormatString = "{0:dd.MM.yyyy HH:mm:ss}")]

but problem remains.

On enabled clientside validation I'm getting The field XXXX must be a date. and when clientside validation is disabled I'm getting on serverside datetime property with default value 0 year (like nothing was selected).

The client side validation can be solved as described in [this answer](http://stackoverflow.com/questions/27285458/jquery-ui-datepicker-and-mvc-view-model-type-datetime/27286969#27286969). Note the `[DisplayFormat]` you have used only applies to `@Html.DisplayFor()` - it has nothing to do with this issue (and if you had `ApplyFormatInEditMode = true` then it would only apply when you use `@Html.EditorFor()` to render the browsers HTML5 datepicker) — , Apr 14 '15 at 13:15
can you please post an answer having my concrete example in mind, when using datetimepicker not just date. I tried but I'm having hard time :) Thanks. — user1765862, Apr 14 '15 at 13:38
You should be able to modify the answer I linked to something like `$.datepicker.parseDate('dd.mm.yy HH:mm:ss', value)`, but I can't test it until tomorrow. — , Apr 14 '15 at 13:41
ok. I'll try. Anyway thanks. When you find time post an answer here and I will accept it. — user1765862, Apr 14 '15 at 13:42
tried, doesnt work. please post solution when you have time. — user1765862, Apr 14 '15 at 13:55

score 0 · Answer 1 · answered Apr 14 '15 at 20:57

You can create your own Validation method as @StephenMuecke mentioned in his comment. I would suggest a different approach and recommend datejs library , the dude did a great job and the library is light but full of features that will save you a lot of time in the future.

Back to your question: the code you have for the JQuery datetime format is correct and you should keep it, That will ensure that the formatting in the control itself is correct:

$('#StartTime').datetimepicker({
    dateFormat: "dd.mm.yy",
    timeFormat:  "HH:mm:ss"  });

For the validation, you can create your own validation routine with the help of datejs ParseExact() method. your code should look like this:

jQuery.validator.addMethod("MyDateTimeFormat", function(value, element) { 
    return Date.parseExact(value, "dd.MM.yyyy HH:mm:ss");

},"Please provide  the correct date time format");

Then you should bind the validator to your control in the page, your code should look something like this:

form.validate({
   rules : {
      StartTime : { MyDateTimeFormat: true }
   }
});

Where StartTime is the id of the TextBox and MyDateTimeFormatis the name of our customized validation.

Here's a .net Fiddle with an example.

please, take a look at this question, I'm getting default value for date on post action. http://stackoverflow.com/questions/29831406/formatting-datetime-on-the-clients-sends-default-date-value-on-form-post — user1765862, Apr 23 '15 at 19:14
Did this solution work for the question you asked on the top? — IndieTech Solutions, Apr 23 '15 at 19:17
I initally thought that it must be a good solution, I still think but something is missing, cause I'm getting on form post action formatted date as default value (01/01/0001). — user1765862, Apr 23 '15 at 19:21

datetime jquery plugin - format date headache

1 Answers1