使用KendoUI datetime验证

时间:2013-03-13 02:51:40

标签: javascript jquery kendo-ui

您好我有一个应用程序,用户可以选择开始日期时间和结束日期时间,如果他们想要创建一个事件。 现在这是一个使用KendoUI datetime插件的HTML:

<div class="demo-section" style="width: 535px;">
                <label for="start">Start date:</label>
                <input id="start" value="01/01/2013" />

                <label for="end" style="margin-left:3em">End date:</label>
                <input id="end" value="01/01/2013"/>
            </div>
</li>

<script type="text/javascript">
$(document).ready(function(){

function startChange() {
    var startDate = start.value();
    if (startDate) {
        startDate = new Date(startDate);
        startDate.setDate(startDate.getDate());
        end.min(startDate);
    }
}

function endChange() {
    var endDate = end.value();

    if (endDate) {
        endDate = new Date(endDate);
        endDate.setDate(endDate.getDate());
        start.max(endDate);
    }
}

var start = $("#start").kendoDateTimePicker({
    change: startChange,
    parseFormats: ["MM/dd/yyyy"]
}).data("kendoDateTimePicker");

var end = $("#end").kendoDateTimePicker({
    change: endChange,
    parseFormats: ["MM/dd/yyyy"]
}).data("kendoDateTimePicker");

start.max(end.value());
end.min(start.value());

});

问题是我不能得到我想要的验证。假设用户选择From日期,To日期应显示的日期大于当前所选日期From日期。我的代码似乎效果不佳。感谢

1 个答案:

答案 0 :(得分:0)

您是说您希望能够选择大于From的{​​{1}}日期,并且当To执行To时应自动更新为大于From }?

如果是这样,你几乎就在那里。您只需更新startChange功能即可更新相对于To的{​​{1}}日期。

From

查看此jsFiddle以获取完整的工作示例。