Kendo UI for JQuery question incoming.
I have a partial view with a kendo template, a kendo window and an observable view model. What I am trying to achieve is put the template inside of the window and then bind it to the view model like:
var kendoDialog = kendo.template($("#window-template").html());
window.center().open();
window.content(kendoDialog);
kendo.bind($("#window-container"), viewModel);
The window is created correctly and the model is populated correctly but before the binding occurs this line:
window.content(kendoDialog);
Throws description is not defined.
In the template its just:
<div class="col-sm-10">
#: description #
</div>
How would I achieve what I am trying to do?
I have prepared a dojo for you to see the problem:
https://dojo.telerik.com/OsANOcox
The issue is that when you are loading the template it is expecting to some form of a model being passed in which currently you aren't so effectively there is a null model to bind.
so in your code changing:
window.content(kendoDialog);
to
window.content(kendoDialog(viewModel));
will load the data into the template.
But if you are looking to bind it via MVVM as you currently appear to want to then you need to change the template so it is binding aware
from:
<div class="col-sm-10">
#= data.description #
</div>
to
<div class="col-sm-10">
<span data-bind="html:description"></span>
</div>
Hope this helps.