This is a migrated thread and some comments may be shown as answers.
How do I bind to a calculated property that depends on an observable array or datasource?
3 Answers 16 Views
This is a migrated thread and some comments may be shown as answers.
David
Top achievements
Rank 1
David asked on 10 May 2019, 03:09 AM

I have a calculated property named "hasDashboards" that I am binding to with the enabled or visible bindings.

var ViewModel = kendo.data.ObservableObject.extend({

    init: function() {

        kendo.data.ObservableObject.fn.init.call(this);

    }

});

var MyViewModel = ViewModel.extend({

    init: function() {

        ViewModel.fn.init.call(this);

    },

    dashboards: new kendo.data.DataSource({ data: [] }),

    hasDashboards: function() {

        var ds = this.get("dashboards");

        return ds.data().length;

    }

});

 

I have tried doing this with an observable array as well instead of a data source, but neither hook into the binding updates. I can get this to work if I use the trigger() function on the view model and specify the hasDashboards field as a parameter, but I would like to avoid this additional complexity. I know I am doing something unsupported by deriving from ObservableObject directly, but we need availability and also build custom widgets.

I have also tried the observable array doing this.get("dashboards.length") (which is supported according to the docs), but that didn't work either. Let me know, thanks!

3 Answers, 1 is accepted

Sort by
0
Veselin Tsvetanov
Telerik team
answered on 13 May 2019, 12:00 PM
Hi David,

I am not quite sure that I fully understand the scenario in question. Nevertheless, if you need to notify the computed property for any change, the entire field it depends on should be altered. An implementation like the following should properly update its value:
var newDataSource = new kendo.data.DataSource({ data: [ "test" ] });
this.set("dashboards", newDataSource);
this.get("dashboards").data([ "test" ]);

Here you will find a small sample implementing the above.

Regards,
Veselin Tsvetanov
Progress Telerik
Get quickly onboarded and successful with your Telerik and/or Kendo UI products with the Virtual Classroom free technical training, available to all active customers. Learn More.
0
David
Top achievements
Rank 1
answered on 13 May 2019, 12:52 PM

So is it correct to say that if a datasource has an item inserted or removed the computed property would not be updated? That is my scenario. It seems that unless I replace the entire property, regardless of the underlying value being observable array, it does not get notified, so I have to use trigger("dashboards").

0
Veselin Tsvetanov
Telerik team
answered on 15 May 2019, 11:08 AM
Hello David,

Yes, that is correct. If an item in the DataSource has changed or it has been removed added from its collection, the computed property will not be notified. That is why you will need to either change the entire DataSource, or use the .trigger("change", { field: "dashboards" }) call.

Regards,
Veselin Tsvetanov
Progress Telerik
Get quickly onboarded and successful with your Telerik and/or Kendo UI products with the Virtual Classroom free technical training, available to all active customers. Learn More.
Tags
MVVM
Asked by
David
Top achievements
Rank 1
Answers by
Veselin Tsvetanov
Telerik team
David
Top achievements
Rank 1
Share this question
or