This is a migrated thread and some comments may be shown as answers.

Triggering a change event on the parent observable when calling kendo.data.Model accept method

2 Answers 484 Views
MVVM
This is a migrated thread and some comments may be shown as answers.
Jack
Top achievements
Rank 2
Iron
Jack asked on 14 Nov 2014, 11:19 AM
Although undocumented, the accept method is very useful in certain scenarios, for example when models have a load and save method. In such scenarios, you do not want an object to create a new object that replaces it in the parent viewModel.

var Contact = kendo.data.Model.define({
        id: 'id',
        fields: {
        ...
        },
        load: function(id) {
            var that = this;
            return $.ajax(...).done(function(data) {
                that.accept(data);
            });
        },
        save: function() {
            return $.ajax(...);
        }
    });

Model.accept is especially good in this case because the result is dirty = false, which you want since the data is fresh from database. Unfortunately, this does not cope with MVVM because no change event is raised.

var id=153, viewModel = kendo.observable({
    contact = new Contact({});
});
contact.load(id); //does not raise a change event on the viewModel

As a consequence, I have implemented a BaseModel to inherit from that overwrites the accept method as follows:

var BaseModel = Model.define({
    accept: function(data) {
        var that = this;
        //Call the base accept method
        Model.fn.accept.call(that, data);
        //Trigger a change event on the parent observable (possibly a viewModel)
        if ($.type(that.parent) === 'function') {
            var observable = that.parent();
            if (observable instanceof kendo.Observable) {
                $.each(Object.keys(observable), function(index, key) {
                    if(observable[key] instanceof that.constructor && observable[key].uid === that.uid) { //we have found our nested object in the parent observable
                        observable.trigger(CHANGE, { field: key }); //otherwise UI won't be updated via MVVM
                        return false; //once we have found the key and triggered the change event, break out of iteration
                    }
                });
            }
        }
    }
});

Is this a fix you would not recommend (any side effects)?
Is there an alternative use of the api that should be preferred?
Otherwise, is this something that could be fixed in Kendo UI?




2 Answers, 1 is accepted

Sort by
0
Jack
Top achievements
Rank 2
Iron
answered on 14 Nov 2014, 11:34 AM
I forgot to add that in the scenario I have been facing non editable fields prevent from using that.set in the load method.
0
Kiril Nikolov
Telerik team
answered on 18 Nov 2014, 01:07 PM
Hi Jacques,

The accept() method will not fire a change event and this is by design as the change event will trigger the refresh, which is not a desired behavior.  About the workaround - if it achieves the desired behavior than I can not see a reason against using it.

Regards,
Kiril Nikolov
Telerik
 
Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
 
Tags
MVVM
Asked by
Jack
Top achievements
Rank 2
Iron
Answers by
Jack
Top achievements
Rank 2
Iron
Kiril Nikolov
Telerik team
Share this question
or