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

Datepicker Min Value to 0001/01/01

7 Answers 3086 Views
Date/Time Pickers
This is a migrated thread and some comments may be shown as answers.
Nimita
Top achievements
Rank 1
Nimita asked on 09 Apr 2020, 09:28 PM
Unable to set DatePicker Min Value to 0001/01/01

7 Answers, 1 is accepted

Sort by
0
Nikolay
Telerik team
answered on 14 Apr 2020, 01:09 PM

Hello Nimita,

The Kendo UI Datepicker default min date is 1900, 0, 1 as noted in its API documentation at:

I there a specific reason you need to set the DatePicker min value to a date earlier than Jan 1st, 1900? 

let me know if I can help with any further questions.

Regards,
Nikolay
Progress Telerik

Progress is here for your business, like always. Read more about the measures we are taking to ensure business continuity and help fight the COVID-19 pandemic.
Our thoughts here at Progress are with those affected by the outbreak.
0
Nimita
Top achievements
Rank 1
answered on 14 Apr 2020, 11:56 PM

Hi Nikolay,

Yes , In out current database we have the startDate values to be 0001/01/01, which is to be displayed in UI.

The Date has to be displayed in the Edit popUp Screen from the Grid.

 

Thanks,

Annie

 

0
Nikolay
Telerik team
answered on 17 Apr 2020, 01:25 PM

Hello Annie,

By default, the min of the DatePickeris set to 1/1/1900. However, this can be overridden by explicitly setting the Min configuration to a date before that. Have in mind that the picker internally uses a Date object which min date is: new Date(-8640000000000000), which is Tuesday, April 20th, 271,821 BCE (BCE = Before Common Era, e.g., the year -271,821). Creating a date prior that will create an Invalid Date.

The following configuration will allow you to select dates on the Calendar before 1900, 01, 01:

    // Declare Edit even
   .Events(e => e.Edit("onEdit"))
...
// Edit evenat handler
    function onEdit() {
        var datepicker = $('#BirthDate').data('kendoDatePicker'); // BirthDate is the name of the Property bound to the DatePicker
        datepicker.min(new Date(-5431214342121412));
    }

Let me know if this helps.

Regards,
Nikolay
Progress Telerik

Progress is here for your business, like always. Read more about the measures we are taking to ensure business continuity and help fight the COVID-19 pandemic.
Our thoughts here at Progress are with those affected by the outbreak.
0
Nimita
Top achievements
Rank 1
answered on 23 Apr 2020, 04:05 PM

Hi Nikolay,

I have a Grid with the StartDate values to be 0001/01/01. On Edit button click of the record , I have to display a Popup screen(Edit Template) with the start Date Kendo Date Picker Control. The KendoDate picker Control is blank , It is not populating the Grid value for Edit. It doesnt allows to enter 0001/01/01 value but on focus change it gets reset to 1900/01/01.

Setting the min Date value is not helping .

Thanks,

Annie

 

 

 

0
Nikolay
Telerik team
answered on 28 Apr 2020, 02:51 PM

Hello Annie, 

The problem here is that years before 100 are treated differently in JavaScript. When creating a date, the numbers from 0 to 99 will be incremented by 1900 automatically and therefore the DatePicker can not bind and display correctly those dates. For example the date "01/01/0001" results to the following year in the browser:

However, setting a min to the DatePicker of "01/01/0100" will allow the binding of the dates after "01/01/0100" and the will be displayed in the popup editor. For your convenience, I am attaching a small ASP.NET Core project demonstrating this.

More information about dates in JavaScript can be obtained in the below StackOverflow thread:

Let me know if you have any questions.

Regards,


Nikolay
Progress Telerik

Progress is here for your business, like always. Read more about the measures we are taking to ensure business continuity and help fight the COVID-19 pandemic.
Our thoughts here at Progress are with those affected by the outbreak.
0
Nimita
Top achievements
Rank 1
answered on 05 May 2020, 11:06 PM

Hi Nikolay,

While using Grid Editor Template (Min) Property to the DatePicker is not working . 

I have given the grid and the Editor Template code below. 

 @(Html.Kendo().Grid<CoreMaster.Models.SecurityAttributeView>()
                      .Name("securityMaster_#=SecurityMasterId#")                   
                      .Editable(editable =>
                      {
                          editable.Mode(GridEditMode.PopUp).TemplateName("secattribute").Window(w => w.HtmlAttributes(new { @style = "width:700px;" }));
                      })
                      .Columns(cols =>
                      {                         
                          cols.Bound(y => y.AttributeName).Title("Attribute");                         
                          cols.Bound(y => y.StartDate).Title("Start Date")
                                        .Format("{0:yyyy/MM/dd}");
                          cols.Bound(y => y.EndDate).Title("End Date")
                                        .Format("{0:yyyy/MM/dd}");
                          cols.Command(command => command.Edit().UpdateText("Update").Text("Edit"));
                      })

 

 

Editor Template file :

 

@model SecurityAttributeView;

<body>
    <ul class="errors"></ul>

    <div style="padding-left: 20px;">
        <div class="row">
            <div class="ms-TextField col-md-6">
                <label class="ms-Label">
                    Attribute Type *
                  
                    @(Html.Kendo().DropDownList()
                                                      .Name("AttributeTypeId")
                                                      .DataTextField("AttributeTypeName")
                                                      .DataValueField("AttributeTypeId")
                                                       .DataSource(source =>
                                                       {
                                                           source.Read(read =>
                                                           {
                                                               read.Action("AttributeTypesSecurity_Read", "AttributeType");
                                                           });
                                                       })
                    )
                </label>
                <span id="attr-type-dropdown-error" class="error-message" style="display: none;">This field is required</span>
            </div>           
        <div class="row">
            <div class="ms-TextField col-md-6">
                <label class="ms-Label">
                    Start Date
                    @(Html.Kendo().DatePicker()
                         .Name("StartDate")
                .Format("{0:yyyy/MM/dd}")
                .DateInput()
                .HtmlAttributes(new { value = "0001/01/01", style = "width: 85%", title = "StartDate" })
                 .Min("0001/01/01")
                     )                   
                </label>
            </div>
            <div class="ms-TextField col-md-6">
                <label class="ms-Label">
                    End Date
                    @(Html.Kendo().DatePicker()
                .Name("EndDate")
                .Format("{0:yyyy/MM/dd}")
                  .HtmlAttributes(new { style = "width: 85%", title = "EndDate" })
                  .Max("9999/12/31")
                .DateInput()
                )                   
                </label>
            </div>
          
        </div>
        </div>
</body>

0
Nikolay
Telerik team
answered on 08 May 2020, 03:03 PM

Hello Annie,

Thank you for getting back to me.

I further investigated and I found a workaround that I think will satisfy the project. It seems that when the min is set directly to the input the DatePicker is correctly bound to the model:

@model DateTime

@(Html.Kendo().DatePickerFor(m => m)
    .HtmlAttributes(new { @min = "01/01/0001" })
    )

Please try this and let me know if anything arises.

Regards,
Nikolay
Progress Telerik

Progress is here for your business, like always. Read more about the measures we are taking to ensure business continuity and help fight the COVID-19 pandemic.
Our thoughts here at Progress are with those affected by the outbreak.
Tags
Date/Time Pickers
Asked by
Nimita
Top achievements
Rank 1
Answers by
Nikolay
Telerik team
Nimita
Top achievements
Rank 1
Share this question
or