6

嗨,我有一个剑道模板,该模板包含一个带有日期时间选择器的文本框,如下所示。

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

现在我想为此设置最小值。即我不想允许选择比今天更早的日子。

有什么例子吗?

4

4 回答 4

6

尝试这个

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));
于 2013-07-25T19:13:42.177 回答
3

通常,你可以在这里做一些 javascript:

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

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

于 2013-07-25T07:06:53.947 回答
2

好的,我最近不得不实现类似的东西,并找到了一种简单的方法来做到这一点。我意识到这为时已晚,但我在研究时发现了这个问题。

说下面是你的模板:(为简洁起见)

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

希望它可以帮助某人...

于 2014-08-29T15:51:10.243 回答
0

您可以在 html 输入中传递 data-min="your Date in proper format" 。

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

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

于 2018-11-14T12:03:58.197 回答