Создание раскрывающегося списка kendo в шаблоне kendo

<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 вопроса: Как я могу создайте экземпляр выпадающего списка kendo из шаблона.

Если это невозможно, как "иметь" событие dataSourceChanged для моего выпадающего списка, чтобы я мог обновить данные в моем выпадающем списке.

6
jquery kendo-datasource kendo-dropdown kendo-ui

3 ответов

я столкнулся с той же проблемой при попытке создать пользовательский всплывающий редактор для сетки. Я обнаружил, что команда edit запускается после того, как шаблон прикреплен к странице, поэтому я смог инициализировать падение Kendo с помощью функции в редактировании.

Так, например, если ваш шаблон выглядит так:

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

2

в вашем шаблоне включите ToClientTemplate:

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

Я постараюсь решить вашу проблему. несмотря на то, что я не собираюсь отвечать на это. Я имею в виду, если проблема в том, что для загрузки данных требуется некоторое время, и вы не хотите показывать раскрывающийся список, пока не получите данные. Моя рекомендация не создает раскрывающийся список, пока вы не получите данные, и способ сделать это с помощью fetch на DataSource.

пример:

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

2