Элементы данных опций KendoDropDownList

Я хотел бы включить KendoDropDownList в свое приложение, однако есть сценарий, в котором я не могу работать. Существующее приложение добавило атрибуты data- в класс ListItem для раскрывающегося списка (поэтому оно отображалось как <option data-xyz="abc" />). Для этого есть законная причина: информация используется для предварительного заполнения формы на стороне клиента, но проблема с kendoDropDownList заключается в том, что он создает свой собственный список, который представляет элементы списка, но не t переносить эти атрибуты данных. Есть ли способ связать выбранный элемент списка с исходным элементом, где я могу получить атрибуты данных? В противном случае, похоже, я вообще не смогу использовать управление.

РЕДАКТИРОВАТЬ: я использовал атрибуты данных для инициализации вместе с kendo.init. Ниже приведен HTML-код:

<select .. data-role="dropdownlist" data-option-label="- Select -">
   <option data-x="y" value="..">..</option>
   <option data-x="y" value="..">..</option>
   .
   .
</select>

Javascript для инициализации:

kendo.init('body');

К вашему сведению, я не использовал привязку MVVM на стороне клиента. Кендо, однако, создает элемент UL с элементами LI, представляющими раскрывающийся список, не используя элементы OPTION, и поэтому при построении списка он не включает все атрибуты.


person Brian Mains    schedule 19.10.2015    source источник
comment
Можете ли вы опубликовать код, показывающий, как вы настраиваете раскрывающийся список и когда пытаетесь получить выбранный вариант?   -  person ezanker    schedule 19.10.2015
comment
Обновлено выше, используя kendo.init для загрузки тела с инициализацией data-.   -  person Brian Mains    schedule 19.10.2015
comment
Похоже, что кендо фактически удаляет атрибуты данных из исходного элемента OPTION, а также создает новые элементы. Так что даже ссылка на оригинальный OPTION не работает. Можете ли вы использовать глобальный поиск по значению вместо атрибутов данных?   -  person ezanker    schedule 19.10.2015
comment
@BrianMains есть какая-нибудь новая информация об этом?   -  person DontVoteMeDown    schedule 21.10.2015


Ответы (2)


Кендо воссоздает элемент, поэтому его атрибуты теряются. Я предлагаю функцию-оболочку, которая копирует атрибуты data- перед созданием виджета, а затем снова устанавливает атрибуты:

$.fn.myDDL = function() {
  var el = $(this);
  var attrs = [];

  el.find("option").each(function() {
    attrs.push($(this).data());
  });

  el
    .kendoDropDownList()
    .find("option").each(function(i, e) {
      var keys = Object.keys(attrs[i]);

      for (var k = 0; k < keys.length; k++) {
        $(e).data(keys[k], attrs[i][keys[k]]);
      }
    });

  // Test
  var opt = $("#abc option:eq(0)").data();
  console.log(opt);
};

$(function()
{
    $("#abc").myDDL();
});

Демо

Я знаю, это уродливо, но в таких случаях кендо ограничено и не предоставляет ресурсов для работы с собственными результатами. Есть ли что-то в наличии, я не знаю. Боюсь, в вашем случае шаблоны не подойдут.

person DontVoteMeDown    schedule 19.10.2015

Рассматривали ли вы использование шаблона?

http://docs.telerik.com/kendo-ui/api/javascript/ui/dropdownlist#configuration-template

person Cody Leroy Lindley    schedule 19.10.2015
comment
Я так и сделал, но надеялся, что подход с атрибутами данных сработает, потому что у нас есть несколько страниц, которые полагаются на использование этой техники... но если это то, что потребуется, я подумаю. Спасибо. - person Brian Mains; 19.10.2015