How Do I Raise the Change Event in the KendoUI DatePicker?

Question

I'm trying to set the value of my DatePicker using the code below and expecting the "Change" event to be raise but it doesn't.

var datePicker = $("#datePicker").data("kendoDatePicker");
var previousDate = new Date(datePicker.value());
previousDate.setDate(previousDate.getDate() - 1);
$("#displayDate").text(kendo.toString(new Date(previousDate), 'D'));
datePicker.value(previousDate);

Change the date value through the user interface does raise the "Change" event as expected however.

Molest

Answer 1

Please try with the below code snippet.

HTML

<input id="datepicker" />
<input type="button" value="set date" onclick="setdateInDP()">

JS

<script type="text/javascript">
$(document).ready(function () {
    function onChange() {
        alert("Change :: " + kendo.toString(this.value(), 'd'));
    }

    $("#datepicker").kendoDatePicker({
        change: onChange
    });
});

function setdateInDP() {
    var datePicker = $("#datepicker").data("kendoDatePicker");
    var previousDate = new Date(datePicker.value());
    previousDate.setDate(previousDate.getDate() - 1);
    datePicker.value(previousDate);
    $("#datepicker").data("kendoDatePicker").trigger("change");
}

Scincoid

The problem is that it won't trigger change on the input as it normally do when you select a date with the picker. This gets done in the _change() function of datepicker... – Eliott