Telerik UI Передача идентификатора сетки в контекстное меню Kendo

У меня есть простое контекстное меню, которое мне нужно, чтобы подключиться к сетке. Это контекстное меню должно позволять пользователю перемещаться по идентификатору записи сетки, с которой он связан.

В настоящее время я пытаюсь передать объект данных HTML, но он не работает должным образом.

Кто-нибудь знает, как экстраполировать ID? Вот отдельный пример того, чего я пытаюсь достичь.

@model IList<EmployeeModel>

<script>
    $(document).ready(function () {
        setTimeout(function () {
            var menu = $("#adminContextMenu"),
                original = menu.clone(true);

            original.find(".k-state-active").removeClass("k-state-active");

            var initMenu = function () {
                menu = $("#adminContextMenu").kendoContextMenu({
                    orientation: 'vertical',
                    alignToAnchor: true,
                    filter: ".adminContextMenu",
                    showOn: "click",
                    animation: {
                        open: {
                            effects: "fadeIn"
                        },
                        duration: 250
                    },
                    select: function (e) {
                        console.log(e);
                    }
                });
            };

            initMenu();
        }, 0);
    });
</script>

<ul id="adminContextMenu">
    <li>Super Long Context Option One</li>
    <li class="k-separator"></li>
    <li>Alpha</li>
    <li>Bravo</li>
    <li>Charlie</li>
</ul>

<div id="clientsDb">
    @(Html.Kendo().Grid(Model)
          .Name("employeeGrid")
          .Columns(columns =>
          {
              columns.Bound(user => user.FullName);
              columns.Bound(user => user.UserGUID)
                     .Width(40)
                     .ClientTemplate("<span><img src='" + @Web_Helpers.StratosphereImageUrl("@Pencil_Icon ") + "' Title='Administration' Class='adminContextMenu' Data-Guid='#= UserGUID #' /></span>")
                     .Title(" ");
          })
          .HtmlAttributes(new {style = "height: 380px;"})
          .Scrollable()
          .Groupable()
          .Sortable()
          .Pageable(pageable => pageable
              .Refresh(true)
              .PageSizes(true)
              .ButtonCount(5))
          .DataSource(dataSource => dataSource
              .Ajax().ServerOperation(false))
    )
</div>

1 ответ

Решение

Если у вашего ClientTemplate есть атрибут Data

.ClientTemplate("<span><img src='img/settings.png' Title='Administration' Class='adminContextMenu' Data-Guid='#= UserGUID #' /></span>")

Вы можете получить это в методе выбора kendoContextMenu

select: function (e) {
    console.log(e.target.dataset.guid);
}
Другие вопросы по тегам