如何为 Kendo Scheduler 开始和结束日期DatePicker控件设置事件? 我想在DatePicker控件的Start或End日期更改时添加一些逻辑,但我不知道该怎么做。
我尝试绑定下面的事件,但它对我不起作用:
start: {
type: "date",
from: "StartDate",
validation: { required: true },
event: { change: "onStartDateChange('start')" }
}
答案 0 :(得分:0)
您可以选择DatePicker
,并在调度程序触发edit
事件时添加新功能。
这里有一些你需要添加的代码片段
$("#scheduler").kendoScheduler({
edit: scheduler_edit // add on scheduler edit events
//remove for clarity
});
接下来,您需要使用jquery查找DatePicker
个组件并将其与新函数绑定。虽然Scheduler
编辑弹出窗口提供了2种类型的不同日期选择器,但您需要谨慎选择是DatePicker
还是DateTimePicker
function scheduler_edit(e) {
console.log("edit");
var startDatePicker = $("input[name=start][data-role=datepicker]").data().kendoDatePicker;
startDatePicker.bind("change", newFuncForDatePicker);
}
function newFuncForDatePicker(e) {
console.log(this.value());
}
对于完整示例,您可以查看此dojo
答案 1 :(得分:0)
我认为您的datePicker未在kendo调度程序中绑定。如果您更改了某个日期并将此日期附加到另一个datePicker中,则可以像这个示例一样使用 这是我的编辑功能,您可以根据需要使用编辑功能或其他功能:
edit: function (e) {
//get date from event
var getDateFromEvent = e.event.start;//or you can use different types of date like that
var datePicker = $("[name=signUpDueDate]").data("kendoDatePicker");
datePicker.value(getDateFromEvent).format("MM/DD/YYYY"));
datePicker.trigger("change");
};
这是你的控制器然后你可以使用那样的HTML
<div class="col-xs-12 col-sm-3 form-group">
<div data-container-for="earlySignupDate">
<input id="signUpDueDate" name="signUpDueDate" class="pull-left" type="text" data-type="date" data-role="datepicker" data-bind="value: SignUpDueDate" />
</div>
</div>
答案 2 :(得分:0)
像这样:
<script>
$("#scheduler").kendoScheduler({
edit: function(e)
{
// clone for input[name=end]
e.container.find("input[name=start]")
.data()
.kendoDateTimePicker.bind("change", function(e) {
var value = this.value();
// value has the new datetime
console.log(value);
});
}
});
</script>