Set the format of a Kendo DateTimePicker date sent to the controller

Question

I'm using a Kendo DateTimePicker in my application.

The value I get from it in my application is

Wed Aug 13 2014 00:00:00 GMT+0200 (Romance Daylight Time)

I can't parse this to a DateTime. I get a "String was not recognized as a valid DateTime." error.

How can I set the format of the date I get from the DateTimePicker?? Is there an option in Kendo DateTimePicker??t

Answer 1

If you Need to Change the Date that you get from your application you can do as below

var dateobj=kendo.parseDate("Wed Aug 13 2014 00:00:00 GMT+0200 (Romance Daylight Time)", "yyyy-MM-dd h:mm:ss tt");
var datestring = kendo.toString(dateobj, "MM-dd-yyyy h:mm:ss tt");

kendo.parseDate() will Parse the Date to a Date Object and kendo.toString() will format the date to a string

If you need to convert the date you get from the Datepicker Do this

var datepicker = $("#datepicker").data("kendoDatePicker");
var value = datepicker.value();
kendo.toString(value,"dd/MM/YYYY")

IF you need to convert Datepicker date to the Sever Date

var datepicker = $("#datepicker").data("kendoDatePicker");
    var value = datepicker.value();
    value.toUTCString();

Answer 2

Here what I have used:

 var dateobj = kendo.parseDate("Wed Aug 13 2014 00:00:00 GMT+0200 (Romance Daylight Time)");
 var datestring = kendo.toString(dateobj, "MM-dd-yyyy h:mm:ss tt");

Answer 3

I created a custom binder which I use in place of the "VALUE" data-bind property

kendo.data.binders.widget.shortdate = kendo.data.Binder.extend({
init: function (widget, bindings, options) {
    kendo.data.Binder.fn.init.call(this, widget.element[0], bindings, options);
    var that = this;
    $(widget.element).on("change", function () {
        that.change();
    });
},
refresh: function () {
    var path = this.bindings.shortdate.path,
        source = this.bindings.shortdate.source,
        value = source.get(path);
    this.bindings["shortdate"].set(value);
},
change: function () {
    var formatedValue = this.element.value,
    value = kendo.toString(new Date(formatedValue), "d");
    if (value) {
        this.bindings["shortdate"].set(value);
    }
}

});

Answer 4

you can also try this

entity.ExpiredDate = ParseDate(model.ExpiredDate);



private static DateTime ParseDate(string input)
        {
            return DateTime.ParseExact(input, formats, CultureInfo.InvariantCulture, DateTimeStyles.None);
        }

  private static string[] formats = new string[]
    {
        "MM/dd/yyyy HH:mm:ss tt",
        "MM/dd/yyyy HH:mm:ss",
        "M/dd/yyyy H:mm:ss tt",
        "M/dd/yyyy H:mm:ss"   ,
        "MM/dd/yyyy hh:mm tt"
    };

You can also see this

Answer 5

If you are binding the grid using the kendo API, you can use .Format("0:d"). Here is the link where you can find meaning of standard and custom formats- Date formatting

Here is one example using custom formatting columns.Bound(model => model.CreatedOn).Format("{0:dd.MM.yyyy - HH:mm:ss}");

It result in this in 24 hour format: 20.07.2016 - 11:01:23.