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

Datepicker in MVVM scenario doesnt support validation needs

3 Answers 162 Views
Date/Time Pickers
This is a migrated thread and some comments may be shown as answers.
Shaun
Top achievements
Rank 1
Shaun asked on 05 Feb 2014, 12:47 AM
Greetings,

We are having difficulty getting the kendoui datepicker working under what we consider to be some fairly common use cases.   

Example 1:

Easily visible via the sample: http://demos.telerik.com/kendo-ui/web/datepicker/events.html

Consider a requirement where this field is optional, but if filled in must parse out and be a legitimate date.   Currently if I enter "asdfasdf" or even something as innocent as "25/5/2012" (consider a non-us user who is used to dd/mm/yyyy) then the changed event is never fired.   I thus have no opportunity to warn the user that the date they have entered is invalid.

Example 2:

Let's say I set a maximum date of todays date on the control.   Now when I click the calendar, it properly disallows selection of a future date.   However, what I can do is go in and type in any date I want.   If a date in the future is inputted, the control determines null as the value and again, since the initial value was null as well the change event is never raised, and there is no way to provide UI validation in an MVVM scenario.


Desired behavior
The easiest change here probably would be to simply give us an option to have the textbox get cleared out when the control loses focus if the date is null that way at least what the user sees in the control will match what the control is reporting as its' value.

A good example of this is the multiselect box.  If you type gyberish into it and tab out, it wipes out the invalid value.  Why does the datepicker need to retain its invalid data?

Otherwise, we need some way to be notified via event not only when the underlying date value has changed, but also when the text changes if we are to jump through these hoops ourselves (manually parse the text according to configured formats, clear out the value if needed, etc).
















3 Answers, 1 is accepted

Sort by
0
Shaun
Top achievements
Rank 1
answered on 05 Feb 2014, 01:32 AM
Hmm, edit post button?   Anywho...

A better alternative would be for the widget to display some kind of 'invalid state' warning or chrome to let the user know the input in the control has not been translated into a valid date.    This is how the telerik radcontrol datepicker worked.
0
Alexander Popov
Telerik team
answered on 06 Feb 2014, 04:30 PM
Hello,

In the current scenario I would recommend using a Kendo UI Validator to validate the widget and display an error message if necessary. Here is a small example that illustrates how this behavior could be implemented.

Regards,
Alexander Popov
Telerik
Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
0
Atlas
Top achievements
Rank 1
answered on 08 Nov 2014, 12:41 AM
I have been pretty disgusted with the validation on the kendo datepicker. What good is validation if it doesn't work regardless of the way the data is input. The validation works great if you use the calendar icon to pick your date, but provides no validation if you hand type in a value.
I have been complaining about this for some time, and the solution I got from Telerik was a cluster. I was having to use a lot of extra code to make it work.
Well I finally got around to investigating custom code attributes, both server side and client side, and discovered that it is quite easy to add a custom code attribute that works on both the client and the server side. You have to create a class that handles both scenarios, and you have to write some custom javascript, but once you get the hang of it, it's really easy.
We have requirements on several of our date values that they are on or before today or on or after today, so I created two attributes:
1) DateTimeMaxNowAttribute
2) DateTimeMinNowAttribute
I will attach the files for all of this. One of the namespaces you will need is the one that supports: ModelClientValidationRule apparently, from what I am reading this used to be in a different namespace, but I you are using MVC 4 or later, this rule exists in the System.Web.WebPages namespace.
use the code  in the attached files and simply decorate your property like so:

        [DateTimeMaxNow]
        [DisplayName("Estoppel Request Date")]
        [DisplayFormat(DataFormatString = "{0:d}")]
        public DateTime? EstoppelRequestDate { get; set; }






Tags
Date/Time Pickers
Asked by
Shaun
Top achievements
Rank 1
Answers by
Shaun
Top achievements
Rank 1
Alexander Popov
Telerik team
Atlas
Top achievements
Rank 1
Share this question
or