MVVM in template

[Paul]

Hi there,

Having failed so far to get angular.js to work nicely with the editor template (see stackoverflow question: http://stackoverflow.com/questions/25527352/kendoui-scheduler-with-angular-js-binding-conflict), I moved on to trying to MVVM to achieve the same result.

I want to have MVVM pull data from my server in order to populate an html option field, but I am unable to get this to do anything. I've created an example here:

http://jsbin.com/layegocoreji/2/

When double clicking to create a new entry in the scheduler, the MVVM is supposed to render a html select field from a static data source, but instead it does nothing. I'd appreciate any advice you can give!

Cheers, Paul.

[Daniel]

Hello Paul,

The approach used in the jsBin will not work because the template expression will be evaluated before the element is added to the DOM. In order to set the data to the dropdownlist with the current setup you could use the data attributes e.g.

<script id="editor" type="text/x-kendo-template">
    <select id="bum" data-role="dropdownlist" data-value-field="employee_uid" data-text-field="title"  data-bind="value:employee_uid" data-source="dataSource"></select>
  </select>
</script>

Using the directives to initialize the dropdownlist and populate the data is also possible:

$scope.dropdownSource = new kendo.data.DataSource({
    data: dataSource
});

<select id="bum" name="employee_uid" kendo-drop-down-list k-data-value-field="'employee_uid'" k-data-text-field="'title'" k-data-source="dropdownSource">
</select>

Regards,
Daniel
Telerik

 

 

[Paul]

Thanks Daniel, the second solution works great for me :)