How to update the ViewModel after programatic changes

[Denis]

Hello,

In the following code, I would like to bind some data (to display it)... but is some case, I need to change the value of some component by code (in JavaScript). In this case, the ViewModel is not updated (by a "two way" binding). Why ?

HTML
    <input type="button" id="btnChangeValues" value="Change Values" /><br/><br />
    <input id="myNumeric" data-bind="value: MyNumeric" /> 
    <input id="myDate" data-bind="value: MyDate" />   

JavaScript
   window.onload = function() {

    var viewModel = kendo.observable({ MyNumeric: 123, MyDate: new Date(2014, 1, 15) });

    $("#myNumeric").kendoNumericTextBox();
    $("#myDate").kendoDatePicker();
    kendo.bind(document.body, viewModel);

    $("#btnChangeValues").click(function() {
        $("#myNumeric").data("kendoNumericTextBox").value(789);
        $("#myDate").data("kendoDatePicker").value(new Date(2015, 3, 28));
        alert(viewModel.get("MyNumeric") + " - " + viewModel.get("MyDate"));   // Display always OLD values: 123 and 2014-2-15
    });

   };

Can you tell me how to force a "ViewModel Refreshing" ? Is it possible ?

Thanks

Denis

[Georgi Krustev]

Hello Denis,

The MVVM uses the change event of the widgets to determine whether to update the corresponding model property. When value of the widget is changed via value method, a change change will not be triggered and the MVVM value binding won't be notified for this change. When you want to update the value programatically then you will need to trigger change event of the widget to notify every MVVM binding attached to this widget:

$("#myNumeric").data("kendoNumericTextBox").value(789);
$("#myNumeric").data("kendoNumericTextBox").trigger("change");

Regards,
Georgi Krustev
Telerik

 

 

[Denis]

Thanks very much... It's perfect !

Where can I find the documentation about this method (there are other argument, except "change" to use) ?

Denis Voituron

[Georgi Krustev]

Hello Denis,

Here you can find more information about trigger method.

Regards,
Georgi Krustev
Telerik