Binding to event function in model root from child

[Wayne Hiller]

I have a model something like this derived from ObservableObject.

Please ignore the syntax as I am just quickly typing this in.

 

viewModel {

     data: {

        filter: {

            Rows: [{Field: "Hello"}]

         }

     },

     fieldChanged: function() {

     }

}

 

I bind to the Row array items manually like this, I cannot bind to the template directly because I cannot have the template re-render the items when a change is done to the model.

 

            var $tbody = $("table tbody", $fd);
            var tmp = kendo.template($("#filtering-row-template").html());


            for (var i = 0; i < this.data.filter.Rows.length; i++) {
                var row = this.data.filter.Rows[i];
                var $r = $(kendo.render(tmp, [row]));
                $tbody.append($r);
                kendo.bind($r, row);
            }

 <script type="text/x-kendo-template" id="filtering-row-template">
    <tr id="#= uid #">
        <td>
            <input class="field" data-role="dropdownlist" data-text-field="Name" data-value-field="ID"
                   data-bind="source: fields, value: Field, events: {change: fieldChanged}" />
        </td>

    </tr>

</script>
​

Everything works when I do this  except it does not find the fieldChanged function in the root object at runtime.I thought it was supposed to walk up the object chain looking for a match. In the Browsers debugger I can do row.parent().parent().parent().parent() and find the fieldChanged function.

 

 

[Alexander Valchev]

Hello Wayne,

You are binding the rows manually directly to the row object, not to the ViewModel instance.

kendo.bind($r, row);

In this case the MVVM will not search the ViewModel to resolve the binding. It will be limited to only the row object.

The recommended solution is to use a template. I cannot suggest other build-in solution for this scenario.

Regards,
Alexander Valchev
Telerik

 

 

[Wayne Hiller]

That is what I was expecting. In my case i am passing the row object to bind so that is the "root" object as far as binding is concerned. The only time it walks up the object graph is when binding via a template and even in that case the object passed to the outer bind is the root. Makes perfect sense. The only reason I was doing this was to try and find a way around an MVVM binding bug https://github.com/telerik/kendo-ui-core/issues/786 

[Alexander Valchev]

Hi Wayne,

The bug was fixed two days ago. The fix will be included in the next internal build which should be uploaded at the end of this week or in the beginning of the next week.

Regards,
Alexander Valchev
Telerik