[Solved] Custom Widget - MVVM Widgets in Templates not properly rendered

[Patrick]

Hi,

I'm developing a custom widget, based on the Blog entry "Creating A Kendo UI MVVM Widget". The template contains a Kendo Dropdownlist. The Dropdown Widget is not properly rendered, only the input field is displayed. What am I doing wrong? Is anything missing there?

The container is defined as:

<div id="customWizardTest" data-role="wizard" data-title="TestConfigWizard" data-width="600" data-visible="false" data-template="template"/>

And my temlplate is defined that way:

<script type="text/x-kendo-template" id="template">
      <div>
           <input id="wizTranscoderList" data-role="dropdownlist"/>
      </div>
</script>

In the "refresh" method of the custom widget the (re)-rendering of the template is done:

refresh: function() {
        var that = this,
            view = that.dataSource.view();
        if(view.length > 0)
        {
            that.template = kendo.template(that.options.template);
            var  html = kendo.render(that.template, view);
            that.trigger(DATABINDING);
            that.element.html(html);
            that.trigger(DATABOUND);
        }
}

The view has content, so the rendering will be executed.

Thanks in advance,
Patrick

[Petyo]

Hello Patrick,

you will need to call the respective methods (kendo.bind or kendo.init) after the html has been inserted. 

Regards,
Petyo
Telerik