在kendo模板中创建一个kendo下拉列表

Question

<script id="myTmpl" type="text/x-kendo-tmpl">
 <div id="myDropDown">
 </div>  

</script>

这是我的一个代码示例.有没有办法在div标签上创建一个下拉列表,因为该div实际上不是一个DOM对象,因此我无法选择Jquery选择器？

$('#myDropDown').kendoDropDownList // invalid, item doesn't exist.

我不打算从HTML下载,因为我的代码中的某个地方有我的下拉列表获取数据,并且获取该数据需要时间.这就是为什么我希望能够做类似的事情

$('#myDropDown').setDataSource //or however the correct syntax is. 

所以有两个问题:如何从模板中实例化一个kendo下拉列表.

如果那是不可能的,如何为我的下拉列表"拥有"dataSourceChanged事件,这样我就可以在我的下拉列表中更新数据.

Answer 1

在您的模板中,包含ToClientTemplate:

<script id="templateId" type="text/x-kendo-template">
   <div>
      @(Html.Kendo().DropDownList()
         ...
         .ToClientTemplate()
      )
   </div>
</script>

Answer 2

我在尝试为网格创建自定义弹出编辑器时遇到了同样的问题。我发现在模板附加到页面后会触发编辑命令，因此我能够使用编辑中的函数来初始化 Kendo drop。

例如，如果您的模板如下所示：

<script id="myTmpl" type="text/x-kendo-tmpl">
     <div id="myDropDown">
     </div>  

</script>

网格看起来像这样：

$("#grid").kendoGrid({
    ...
    editable: {
        mode: "popup",
        template: kendo.template($("#myTmpl").html())
    },
    edit: function (e) {
        $("#myDropDown").kendoDropDownList({
              ...
        });
    }

});

这是一个工作示例： http: //jsfiddle.net/ak6hsdo8/2/