Автоматическое заполнение поля кендо с помощью jquery selector

Question

У меня есть несколько тегов, как показано ниже в моем HTML.

<li data-code="ABC" 
<li data-code="XYZ" 
<li data-code="PQR" 

Мне нужно добавить три значения в коробку с автоматической коробкой kendo.

<input id='myKendobox'/> 

Я использовал приведенный ниже код, чтобы получить список.

var items = $("li").map(function() { return $(this).attr("data-code"); }).get(); 

У меня есть два вопроса: Как я убедиться, что четвертый пустой элемент не входит в список «пунктов»? Как заполнить элементы в моей коробке автозапуска kendo?

Answer 1

Ваши li элементы не закрыты, вы поняли?

Для заполнения автозаполнения вы можете сделать:

Учитывая вход HTML (автозаполнение):

<input id='myKendobox'/> 

и инициализация следующим образом:

var data = []; 
var autocomplete = $("#myKendobox").kendoAutoComplete({ 
    dataSource: data 
}).data("kendoAutoComplete"); 

Если вы хотите добавить элементы, которые вы делаете:

var items = $("li").map(function() { return $(this).attr("data-code"); }).get(); 
autocomplete.dataSource.data(items); 

Если вы хотите ограничить <li> элементов, найденных вашего селектор JQuery вы можете определить их как:

<ul id="AutocompleteOptions"> 
    <li data-code="ABC"></li> 
    <li data-code="XYZ"></li> 
    <li data-code="PQR"></li> 
</ul> 

, а затем перевести переключатель в положении:

var items = $("li", "#AutocompleteOptions").map(function() { return $(this).attr("data-code"); }).get(); 

Это ограничивает <li> найти только те, под #AutocompleteOptions.

Пример: JSFiddle