7
<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. 

所以 2 个问题:如何从模板中实例化一个剑道下拉菜单。

如果那不可能,如何为我的下拉列表“拥有”一个 dataSourceChanged 事件,以便我可以更新下拉列表中的数据。

4

3 回答 3

7

在您的模板中,包括 ToClientTemplate:

<script id="templateId" type="text/x-kendo-template">
   <div>
      @(Html.Kendo().DropDownList()
         ...
         .ToClientTemplate()
      )
   </div>
</script>
于 2014-06-17T18:27:26.963 回答
4

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

例如,如果您的模板如下所示:

<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/

于 2015-01-26T19:35:25.873 回答
2

尽管我不打算回答,但我会尝试解决您的问题。我的意思是,如果问题是数据需要一些时间才能加载,并且您不想在获取数据之前显示 DropDownList。我的建议是在您没有获得数据之前不要创建 DropDownList,并且这样做的方式是fetchDataSource.

例子:

// Define the DataSource
var ds = new kendo.data.DataSource({
    ...
});

// Trigger a read and wait for finishing it
ds.fetch(function() {
    $("#myDropDown").kendoDropDownList({
        dataSource: ds,
        ...
    });
});

有了这个,你不需要模板,你的 HTML 是:

<div id="myDropDown"></div>

你可以在这里看到它:http: //jsfiddle.net/OnaBai/Ex8Kz/

于 2014-06-17T22:00:21.077 回答