Min/Max bindings for DatePicker and TimePicker in Kendo UI for jQuery MVVM

Jonathan

58 posts

Member since:
Jun 2012

Posted 11 Apr 2012 Link to this post

Is it possible to bind the Min & max settings for a time and date picker from a model? So if I have a StartDate and EndDate property I can make sure that startdate is always before the enddate and vise versa?

Alexander Valchev

Admin

2895 posts

Posted 12 Apr 2012 Link to this post

Hello Jonathan,

I am afraid that this functionality is not supported at present. The developers are aware of that limitation and this feature will be included in our future releases.
Currently you can set up min and max values only through the configuration options.

Regards,
Alexander Valchev
the Telerik team

Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!

Anil

11 posts

Member since:
Apr 2013

Posted 14 Aug 2013 Link to this post

Hi, Is this functionality currently supported in Q2 release of Kendo UI

Thanks,
Anil

Alexander Valchev

Admin

2895 posts

Posted 16 Aug 2013 Link to this post

Hello Anil,

To achieve this you can use custom bindings. I prepared a jsBin example that demonstrates the implementation:

http://jsbin.com/eqidex/2/edit

Regards,
Alexander Valchev
Telerik

Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!

Anil

11 posts

Member since:
Apr 2013

Posted 10 Apr 2014 Link to this post

Hello Alexander, Is there an alternate mechanism to doing this other than custom bindings. has anything been done on this for the 2014 Q1 release.

Thanks,
Anil

Alexander Valchev

Admin

2895 posts

Posted 14 Apr 2014 Link to this post

Hello Anil,

Since Q1 2014 the DatePicker supports min/max values as HTML attributes. For example:

<input id="birthdate" name="birthdate" value="" max="1993-12-07" />

<script>

$("#birthdate").kendoDatePicker();

</script>

Regards,
Alexander Valchev
Telerik

Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!

Steven

4 posts

Member since:
Jul 2014

Posted 03 Sep 2014 in reply to Alexander Valchev Link to this post

Why does this not work?

<input
data-role="datepicker"
data-format="MMMM yyyy"
data-depth="year"
data-start="year"
data-max="selectedMaxDate"
data-bind="value:selectedMinDate">

Alexander Valchev

Admin

2895 posts

Posted 04 Sep 2014 Link to this post

Hello Steven,

As discussed in the previous replies, it is not possible to set the min/max configuration options of the widget via data attributes.
Please use the HTML5 min/max input attributes as described below.

Regards,
Alexander Valchev
Telerik

Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!

Keith

24 posts

Member since:
Sep 2011

Posted 17 Aug 2015 in reply to Alexander Valchev Link to this post

How would I set it up to max with today's date?

Petyo

Admin

2444 posts

Posted 20 Aug 2015 Link to this post

Hello Keith,

there is no direct way to assign the max to a dynamic date via html attributes - strings like "today" won't be parsed. You may do that with jQuery initialization, though.

Regards,
Petyo
Telerik

Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!

Keith

24 posts

Member since:
Sep 2011

Posted 26 Aug 2015 Link to this post

Thanks, I'll give it a try that way.

Curt Rabon

79 posts

Member since:
Dec 2008

Posted 15 Jul 2016 in reply to Alexander Valchev Link to this post

Support for this seems to have been added somewhere between 2013 and 2016.2. It's working for me using data-min, etc. Please give me the URL of the documentation page for this, thanks.

Petyo

Admin

2444 posts

Posted 21 Jul 2016 Link to this post

Hi,

the static assignment through the data attributes works as expected - the thread discusses the possibility of binding these values to a view model values, which is not supported.

Regards,
Petyo
Telerik by Progress

Get started with Kendo UI in days. Online training courses help you quickly implement components into your apps.

T. Tsonev

Admin

2831 posts

Posted 21 Jul 2016 Link to this post

Hello,

Options, including min and max, can be set via data attributes initialization. These are not MVVM bindings and will not update the widget if the attribute value changes.

I hope this helps.

Regards,
T. Tsonev
Telerik by Progress

Get started with Kendo UI in days. Online training courses help you quickly implement components into your apps.

Curt Rabon

79 posts

Member since:
Dec 2008

Posted 21 Jul 2016 in reply to T. Tsonev Link to this post

Thanks Tsonev, Petyo's answer did confirm what I said that these static attributes work, but failed to answer what I asked for, which is a link to the documentation. Thanks for the link. So, basically the doc page says that all "attributes" of a widget (like min max for the datapicker for example) can be specified in HTML using data-* attributes. Thanks also for letting me know that this does work, but is different from MVVM bindings, which are much more limited.

Curt Rabon

79 posts

Member since:
Dec 2008

Posted 21 Jul 2016 in reply to Curt Rabon Link to this post

So, I guess full support for data-attributes (full support meaning it now allows min/max for datepicker) was added sometime after Sept. 2014, because in Alexander Valchev's reply above, he states it's NOT possible. When did it get added? Thanks.

Petyo

Admin

2444 posts

Posted 26 Jul 2016 Link to this post

Hi,

if I understand you correctly, you are looking for the content of this help article.

Regards,
Petyo
Telerik by Progress

Get started with Kendo UI in days. Online training courses help you quickly implement components into your apps.