Search code examples
javascriptdata-bindingkendo-uikendo-template

Kendo, basic template binding

Maybe I misunderstood the documentation but I thought I could do this and apparently I can't ...

http://jsfiddle.net/dh2b835m/1/

<script id="editor" type="text/x-kendo-template">
    <h2>Object Id: #: data.id #</h2>
</script>

<div id="component" 
     data-bind="source: model" 
     data-template="editor" 
/>

<script>
   $(function() {
     var model = new kendo.observable({ id: 'test' });
     var component = $("#component");
     kendo.bind(component, model);
   });
</script>

What am I missing here?

Solution

  • Ok turns out the documentation has no mention of this but you're supposed to use this when binding the root in this way ...

    <div id="component" 
     data-bind="source: this" 
     data-template="editor" 
/>

    All that did (after solving this question) was raise a load more questions ... great!