MVVM calculated field not updated when dependant field changed

2 posts, 1 answers
  1. Answer
    Al avatar
    1 posts
    Member since:
    Jun 2012

    Posted 27 Nov 2013 Link to this post

    Hi there,

    I am at the moment implementing a dirty check using kendo MVVM calculated field, here is the code snippet

    function viewModelSource(data) {    
        if (this instanceof viewModelSource) {
            this.Title = data.title;

            // dirty flag
            this.IsDirty = false;
            this.resetDirty = function () {
                this.set("IsDirty", false);
            this.CheckDirty = function () {
                this.set("IsDirty", true);

    var viewModel = kendo.observable(new viewModelSource(data));
    kendo.bind($container, viewModel);

    <input type="text" data-bind="value: Title" />

    The problem is when the input value changes, I expect the dirty flag to be set to true, but it never was.

    any help would be appreciated.

  2. Daniel
    Daniel avatar
    2231 posts

    Posted 29 Nov 2013 Link to this post

    Hello James,

    The dependent method should be bound to an element in order for it to be called when a dependent value is changed:
        <input type="text" data-bind="value: Title" />
        <span data-bind="text: CheckDirty"></span>
    Otherwise, you should use the change event in order to set the IsDirty flag when the Title changes:
    var viewModel = kendo.observable(new viewModelSource(data));
    viewModel.bind("change", function (e) {
        if (e.field == "Title") {
            this.set("IsDirty", true);

    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
Back to Top