Question

嗨我有一个剑道模板，该模板包含一个类似下面的文本框，带有日期时间选择器。

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

现在我想为此设置最小值。即我不想允许选择前几天而不是今天。

任何一个例子？

Answer 1

试试这个

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 2

通常，你可以在这里做一些javascript：

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

但我不确定它是否会以某种方式在您的模板中运行。也许这是一个开始。

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())

希望它有所帮助...

Answer 4

您可以在html输入中传递data-min =“您的日期（格式正确）”。

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

这甚至不会显示超出最小值的日期。

如何设置kendo日期时间选择器的最小日期

4 个答案: