Добавить пользовательские данные- * атрибуты для Kendo UI AutoComplete или ComboBox

Question

В настоящее время используется интерфейс Kendo UI AutoCompleteFor() и ComboBoxFor().

Отметив, что они генерируют/визуализуют связку <li> s.

Как добавить дополнительный пользовательский data-* attributes к тем <li> s?

Вот текущий сценарий:

1. Пользователь начинает вводить материал в
2. вызов Ajax AutoCompleteFor вызывается принести некоторые данные, относящиеся к тому, что пользователь напечатал.
3. Полученные результаты преобразуются в IEnumerable<SelectListItem>.
4. Результат отправляется Json. Json(result, JsonRequestBehavior.AllowGet)

Моя цель состоит в том, чтобы добавить один или несколько дополнительных data-* attribute к каждому из этих <li> генерировать строки, так что я могу принести эти данных- * в onChange() случае.

Как достичь этого?

Кроме того, я знаю, что я мог бы создать свой собственный .Template() и, возможно, достигнуть своей задачи, но мне было любопытно, если кто-то знает об этом по-другому, а затем должен создать свой собственный шаблон.

С уважением

Answer 1

Ok Я нашел решение; Я поделюсь им здесь, если кто-то заинтересован.

Вместо преобразования моих полученных результатов в IEnumerable<SelectListItem>, я просто преобразую это в IEnumerable<CustomDTO>.

CustomDTO класса выглядит следующим образом:

public class CustomDTO 
{ 
    public int Value { get; set; } 
    public string Text { get; set; } 
    public int Age { get; set; } 
    //Add whatever more properties you think you’ll need. 
} 

В моем контроллере, я тогда сделайте следующее:

var result = _myService.GetData().ToList(); 
return Json(result, JsonRequestBehavior.AllowGet); 

Где GetData() возвращает IEnumerable<CustomDTO>.

Внутри моего вида у меня есть элемент управления AutoCompleteFor(), к которому я привязываю клиентскую сторону. .Events(x => x.Select("onSelect") обработчик события.

обработчик определяется следующим образом:

function onSelect(e) 
{ 
    if (e.item == null) return; 
    var dataItem = this.dataItem(e.item.index()); 
    var valueAttribute = dataItem.Value; 
    var textAttribute = dataItem.Text; 
    var ageAttribute = dataItem.Age; //This is how I get my additional value 
    //...code... 
} 

Так вот это.