剣道で現在の日付を設定するにはdatepicker日付ビューカレンダー

Question

私は剣道UIで作業しています。のような特定のタスクを実行するために小さなコードスニペットを書く必要がありました剣道の日付ピッカー私は最初の日付ピッカー日付を選択して、私が2番目の日付ピッカーをクリックすると、前に選択された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); 
        } 
        } 
       }); 
      }); 

は、私がここでdateview

Answer 1

でsessionDateを強調したい2つの例です：

コードは以下のようなものです

1. の変化に対するdatepicker2の日付を設定します。 datepicker1
2. datepicker3はONLY 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>