JS Fiddle example here which has an "Action" column with a simple data-bind click handler that will not fire:
I found I can call kendo.bind() on the dataBound Grid event, but this feels like a hack and I lose the ability to have data-bind events pass the row data rather than my top-level Observable object I use in the bind() call..
5 Answers, 1 is accepted
Indeed you need to use the dataBound event of the Grid, otherway the elements are still not created and when kendo.bind traverses the DOM it wont bind any of these rows.
I need to be able to bind each row to the individual data item that the other columns are bound to.
In my updated JSFiddle, I am calling kendo.bind() in the dataBound event and the "clicked" alert now displays, but the "e" object in the templateClicked function is the viewModel, not the row:
You cannot bind one piece of Html simultaneously to two or more ViewModels. You can bind the row (tr element) to the corresponding dataItem that the Grid uses, however binding to the top viewModel will be lost.
Here is a small demonstration
It shows a text-binding, the dataBound event is again used.
I am not sure if there is a better way to do this, but the problem i am finding is that it calls databound again for each row so the loop causes it to be exponential.
Is there a work around for that?
I adjusted the sample to show the binding: http://jsfiddle.net/2wx5su6g/
Calling the kendo.bind() method for the Grid's rows is the proper way of passing the data to the template. And while kendo.bind() is called for every row, the Grid's "dataBound" event handler fires only once: https://dojo.telerik.com/UPuhAWOW So in the example in question: 3 calls to kendo.bind() (since there are 3 rows), which do not affect the "dataBound" event - it fires once.
Virtual Classroom, the free self-paced technical training that gets you up to speed with Telerik and Kendo UI products quickly just got a fresh new look + new and improved content including a brand new Blazor course! Check it out at https://learn.telerik.com/.