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

Start date and end date validation

1 Answer 1514 Views
Date/Time Pickers
This is a migrated thread and some comments may be shown as answers.
DHHS
Top achievements
Rank 1
DHHS asked on 16 Jul 2015, 11:07 PM
I have a start date and end date validation where user can not choose a end date previous that of start date. I have written code on datepicker change event and it is working fine. But if i have already have value in the start date from the model and didnt pick from the datepicker, on end date change event the value of start date is null.
View Code/ works fine if the value is picked from datepicker
 
    <div class="form-group">
          @Html.LabelFor(model => model.StartDate, htmlAttributes: new { @class = "control-label col-md-2 k-label" })
          <div class="col-md-10">    
              @(Html.Kendo().DatePicker().Name("StartDate").Value(Model.StartDate).HtmlAttributes(new { style = "width:250px", onkeydown = "javascript:return false;", required = "required" }).Events(e => e.Change("startChange"))) 
         
              @Html.ValidationMessageFor(model => model.StartDate, "", new { @class = "text-danger" })
          </div>
      </div>
 
      <div class="form-group">
          @Html.LabelFor(model => model.EndDate, htmlAttributes: new { @class = "control-label col-md-2 k-label" })
          <div class="col-md-10">
              @(Html.Kendo().DatePicker().Name("EndDate").Value(Model.EndDate).HtmlAttributes(new { style = "width:250px", onkeydown = "javascript:return false;" }).Events(e => e.Change("endChange")))               
     
              @Html.ValidationMessageFor(model => model.EndDate, "", new { @class = "text-danger" })
          </div>
      </div>
 
 
function startChange() {    
      var endPicker = $("#EndDate").data("kendoDatePicker"),
          startDate = this.value();
      if (startDate) {
          startDate = new Date(startDate);
          startDate.setDate(startDate.getDate() + 1);
          endPicker.min(startDate);
      }
  }
 
  function endChange() {      
      var startPicker = $("#StartDate").data("kendoDatePicker"),
          endDate = this.value();      
      if (endDate) {
          endDate = new Date(endDate);
          endDate.setDate(endDate.getDate() - 1);
          startPicker.max(endDate);
      }
  }

1 Answer, 1 is accepted

Sort by
0
Georgi Krustev
Telerik team
answered on 20 Jul 2015, 12:10 PM
Hi,

The described behavior is not expected. The "StartDate" widget should have an initial value if it was set from the Model. I suppose that in this case, the widget's max value is set to a lower date than the current selected. In this case the value of the widget will be adjusted, but it will not be "null". Could you check and if possible modify the attached test project? This will help us to see the issue locally and find a feasible solution faster.

One thing that come to my mind is that you can set the Min/Max values of the widgets initially too:
@(Html.Kendo().DatePicker().Name("StartDate")
 ...
 .Max(model.EndDate)
)
 
@(Html.Kendo().DatePicker().Name("EndDate")
 ...
 .Min(model.StartDate)
)

Regards,
Georgi Krustev
Telerik
Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Feedback Portal and vote to affect the priority of the items
Tags
Date/Time Pickers
Asked by
DHHS
Top achievements
Rank 1
Answers by
Georgi Krustev
Telerik team
Share this question
or