如何設置劍道日期時間選擇器的最短日期

Question

您好我有一個劍道模板，該模板包含一個文本框，如下面的日期時間選擇器。

<script id="popup_editor" type="text/x-kendo-template"> 
    <input data-role="datepicker" data-bind="value: datePickerValue" /> 
</script> 

現在我想爲此設置最小值。即我不想允許選擇比今天更早的日子。

任何示例？

Answer 1

通常，你可以在這裏做一些javascript：

var myDatePicker = $("#date").kendoDatePicker().data("kendoDatePicker"); 
myDatePicker.min(new Date()); 

，但我不知道，如果它要你的模板的方式進行工作。也許這是一個開始。

Answer 2

試試這個

var myDatePicker = $("#myDatePicker").kendoDatePicker().data("kendoDatePicker"); 
var today = new Date(); 
var day = today.getDate(); 
var month = today.getMonth() + 1; 
var year = today.getFullYear(); 
myDatePicker.min(new Date(year,month,day)); 

Answer 3

好吧我最近實施類似的東西，發現一個簡單的方法來做到這一點。我意識到這太晚了，但我在做我的研究時發現了這個問題。

說下面是你的模板：（簡化爲簡潔起見）

<div class="k-block k-shadow"> 
     <p>Contract Start Date: </p> 
     <input type="text" tabindex="7" 
      class="k-input k-textbox" 
      name="Contract_Start_Date" 
      id="Contract_Start_Date" 
      data-bind="value:Contract_Start_Date" 
      data-format="MMMM yyyy" 
      data-start="year" 
      data-depth="year" 
      data-change="setContractMinEnd" 
      data-role="datepicker" /> 
    </div> 
    <div class="k-block k-shadow"> 
     <p>Contract End Date: </p> 
     <input type="text" tabindex="8" 
      class="k-input k-textbox" 
      name="Contract_End_Date" 
      id="Contract_End_Date" 
      data-bind="value:Contract_End_Date" 
      data-format="MMMM yyyy" 
      data-start="year" 
      data-depth="year" 
      data-role="datepicker" /> 
    </div> 

爲CONTRACT_START_DATE場下面的代碼分配一個JS功能，該字段的「更改」事件：

data-change: setContractMinEnd

我在腳本塊中添加上述函數以與頁面一起出去。而現在每次開始日期更改結束日期時間得到一個最小值是開始日期：

function setContractMinEnd() { 
    var edval = $('#Contract_Start_Date').data("kendoDatePicker"); 
    var sdval = $('#Contract_End_Date').data("kendoDatePicker"); 
    if (sdval && edval) {       
     edval.min(sdval.value()); 
    } 
} 

可以明顯獲得幻想與邏輯，並設置低於或諸如此類的話：

edval.min(new Date())

希望它可以幫助別人......