MVVM calculated field not updated when dependant field changed

2 posts, 1 answers
  1. Answer
    Al
    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.get("Title");
                this.set("IsDirty", true);
            }
        }
    }

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

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

    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.

    Thanks
    James
  2. Daniel
    Admin
    Daniel avatar
    2118 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:
    <div>
        <input type="text" data-bind="value: Title" />
        <span data-bind="text: CheckDirty"></span>
    </div>
    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);
        }
    });


    Regards,
    Daniel
    Telerik
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
  3. Kendo UI is VS 2017 Ready
Back to Top