Kendo Observable Change event

Question

I have a kendo Obervable as follows:

var ViewModel = kendo.observable({
     ID: 1,
     TITLE: "SomeValue",
});

and then I have bound this as follows:

kendo.bind($(".bind-view"), ViewModel );

Now there is button on the page. When clicked I need to check if there are any changes to this ViewModel.

I have tried

    $(".ClearAnalysisInfo").on('click', function (event) { 
         ViewModel.bind("change", function (e) {
         //Some code
      });
  });

But I'm not able to get this ViewModel property whether it changed or not.

Answer 1

Binding the ObservableObject's change event of inside the button's click handler is too late. You need to do that immediately after the ObservableObject is created.

Inside the change handler, you will receive information about the changed field. Use this information to raise some JavaScript flag or save the details you need, so that you can use them later in the button's click handler.

var viewModelChanged = false;

var ViewModel = kendo.observable({
    ID: 1,
    TITLE: "SomeValue",
});

ViewModel.bind("change", function (e) {
    viewModelChanged = true;
});

$(".ClearAnalysisInfo").on('click', function (event) { 
    if (viewModelChanged) {
        // ...
    }
});