如何在 kendo ui datepicker 日期视图日历中设置当前日期答案

【问题标题】：How to set current date in kendo ui datepicker date view calender如何在 kendo ui datepicker 日期视图日历中设置当前日期
【发布时间】：2016-09-28 11:14:28
【问题描述】：

我正在使用 kendo UI。我必须编写小代码 sn-ps 来执行某些任务，例如，我有两个 kendo Date Picker 假设我选择了第一个 date-picker date ，当我点击第二个 date-picker 时，如何set calendar view highlight date (default it is current date) 之前选择的日期在第一。

代码如下：

     $(document).ready(function() {               
             var sessionDate=new Date();
                 $("#datepickerFrom").kendoDatePicker({                  
                   change:function() {
                    if(this.value()!=null)
                    {
                      sessionDate=this.value();
                    }

                  }
                });
              $("#datepickerTo").kendoDatePicker({
                  open: function() {
                    if(this.value()==null)
                    {                                       
                      var calendar = this.dateView.calendar;
                      calendar.current(sessionDate);
                    }
                  }
                });
            });

我想在日期视图中突出显示 sessionDate

【问题讨论】：

你检查答案了吗？

标签： javascript jquery kendo-ui datepicker kendo-asp.net-mvc

【解决方案1】：

这里有两个例子：

在 datepicker1 更改时设置 datepicker2 的日期
仅在打开 datepicker3 时设置 datepicker3 的日期

这两个值都取自 datepicker1

$(document).ready(function() {
  var sessionDate;
  // create DatePicker from input HTML element
  $("#datepicker1").kendoDatePicker({
    change: function() {
      sessionDate = this.value()
      $("#datepicker2").data("kendoDatePicker").value(sessionDate);
    }
  });
  $("#datepicker2").kendoDatePicker();
  $("#datepicker3").kendoDatePicker({
    open: function() {
      this.value(sessionDate)
    }
  });
});

<style>html { font-size: 14px; font-family: Arial, Helvetica, sans-serif; }</style>
<link rel="stylesheet" href="//kendo.cdn.telerik.com/2016.3.914/styles/kendo.common-material.min.css" />
<link rel="stylesheet" href="//kendo.cdn.telerik.com/2016.3.914/styles/kendo.material.min.css" />
<link rel="stylesheet" href="//kendo.cdn.telerik.com/2016.3.914/styles/kendo.material.mobile.min.css" />

<script src="//kendo.cdn.telerik.com/2016.3.914/js/jquery.min.js"></script>
<script src="//kendo.cdn.telerik.com/2016.3.914/js/kendo.all.min.js"></script>
<div id="example">
  <div class="demo-section k-content">

    <h4>Datepicker 1:</h4>
    <input id="datepicker1" value="10/10/2011" style="width: 100%" />

    <h4>Datepicker 2 (set value on change of datepicker1):</h4>
    <input id="datepicker2" value="10/10/2011" style="width: 100%" />

    <h4>Datepicker 3 (set value on open):</h4>
    <input id="datepicker3" value="10/10/2011" style="width: 100%" />
  </div>
  <script>
  </script>
</div>

【讨论】：