This is a migrated thread and some comments may be shown as answers.

DatePicker format angular

8 Answers 745 Views
Date/Time Pickers
This is a migrated thread and some comments may be shown as answers.
cp
Top achievements
Rank 1
cp asked on 27 Aug 2014, 04:02 AM
Hi,
I am having some trouble formatting dates that come from a web api as MM/dd/yyyy. When using this format I am not able to bind the date, however other formats such as yyyy-MM-dd work just fine.

Here is my view:
<input name="enddate" data-kendo-date-picker data-k-format="'MM/dd/yyyy'" data-ng-model="trip.EndDate" data-k-ng-model="trip.EndDate" required>

When the promise returns from the web api if I set the date to the exact date that gets returned the above format works: i.e: $scope.trip.EndDate = "2015-07-11T00:00:00"

Any ideas what I might be missing?

Thanks,

8 Answers, 1 is accepted

Sort by
0
Kiril Nikolov
Telerik team
answered on 28 Aug 2014, 11:02 AM
Hello Claudio,

The problem comes from the fact that the widget will expect a date object and you are setting the date as a string. Using new Date() to format the date seems to be working:

http://dojo.telerik.com/eDAxO

Regards,
Kiril Nikolov
Telerik
 
Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
 
0
cp
Top achievements
Rank 1
answered on 28 Aug 2014, 02:06 PM
Hi Kiril,
I am not setting the date as a string, I was just giving an example where the formatting works. However when I just assign the json object that comes from the API (the property is a DateTime in my API model) to the js bound object the formatting does not.

i.e.: $scope.trip.EndDate = "2015-07-11T00:00:00" --- works
       $scope.trip = data --- k-format='yyyy-MM-dd' works, but k-format='MM/dd/yyyy' does not work

I am getting "Failed to load snippet" when trying to bring up the link you posted.

Thanks,
0
Kiril Nikolov
Telerik team
answered on 29 Aug 2014, 10:34 AM
Hello Claudiu,

I moved the example to jsBin, so please check it on the following link:

http://jsbin.com/jemuz/1/edit

If this is not what you are looking for, please change the snippet in order to represent the issue that you are facing and we will take a look.

Regards,
Kiril Nikolov
Telerik
 
Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
 
0
cp
Top achievements
Rank 1
answered on 19 Sep 2014, 04:16 AM
This sort of works, although I see several issues with this approach:
1. If I have an object that has several date properties I have to cast each and every one of them to a date - any reason the control does not support the MM/dd/yyyy out of the box just like it does with the dd-MM-yyyy one?
2. Dealing with timezones - how would I go about ignoring the timezone?

Thanks,
0
Kiril Nikolov
Telerik team
answered on 19 Sep 2014, 10:26 AM
Hello Claudiu,

The widget supports MM/dd/yyyy as shown in the code snippet that I provided you with in my previous response.

As for the timezone questions - you can convert all days to UTC, so you will not need to convert between timezones.

Regards,
Kiril Nikolov
Telerik
 
Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
 
0
cp
Top achievements
Rank 1
answered on 20 Sep 2014, 01:49 AM
I think I got it working now, thanks.

How do you go about rebinding a min/ max value. I have tried setting k-options and k-rebind, however something isn't quite right with my code:

http://jsbin.com/qinubakumucu/4/edit

You will notice that changing the value of the first datepicker turns the second datepicker into a textbox.

Thanks,
0
cp
Top achievements
Rank 1
answered on 20 Sep 2014, 02:06 AM
Also please note that when both k-ng-model and ng-model use the same property the datepicker becomes 'readonly' - when they are different one can type in a date just fine.
0
Kiril Nikolov
Telerik team
answered on 23 Sep 2014, 10:57 AM
Hello Claudiu,

Here is an example on how to change max/min runtime:

http://dojo.telerik.com/icuZ

As for using both ng-model na k-model for the same property - this is not supported, in general does not make really sense to have both of them bound to the same property.

Regards,
Kiril Nikolov
Telerik
 
Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
 
Tags
Date/Time Pickers
Asked by
cp
Top achievements
Rank 1
Answers by
Kiril Nikolov
Telerik team
cp
Top achievements
Rank 1
Share this question
or