Как программно выбрать пункт меню в меню Кендо

У меня есть меню со значениями, и я хочу добавить сочетание клавиш, которое будет выбирать этот элемент.

Я могу продемонстрировать в этой скрипте именно то, что я ищу

function onSelect(e) {
    var item = $(e.item),
        menuElement = item.closest(".k-menu"),
        dataItem = this.options.dataSource,
        index = item.parentsUntil(menuElement, ".k-item").map(function () {
            return $(this).index();
        }).get().reverse();

    index.push(item.index());

    for (var i = -1, len = index.length; ++i < len;) {
        dataItem = dataItem[index[i]];
        dataItem = i < len-1 ? dataItem.items : dataItem;
    }

    alert(dataItem.value);
}

$(document).ready(function() {

    $("#menu").kendoMenu({
        dataSource: [
            {
                text: "Item 1 (A)",
                value: "A",
                items: [
                    {
                        text: "Sub Item 1 (L)",
                        value: "L",
                        items: [
                            {
                                text: "Sub Sub Item 1 (D)",
                                value: "D"
                            },
                            {
                                text: "Sub Sub Item 2 (E)",
                                 value: "E"
                            }
                         ]
                    },
                    {
                        text: "Sub Item 2 (O)",
                        value: "O"
                    }
                ]
            },
            {
                text: "Item 2 (F)",
                value: "F"
            },
            {
                text: "Item 3 (G)",
                value: "G"
            }
        ],
        select: onSelect
    });

    $(document.body).keydown(function (e) {
            var menu = $("#menu").kendoMenu().data("kendoMenu");
            if (e.altKey && e.keyCode == 76) {
                alert("select item with value L");
                // Pseudocode:
                // var item = find item with value L
                // menu.select(item); (or trigger)
            }
        }); 
});

Я нигде не мог найти никаких ресурсов, которые могли бы это сделать. Также я не могу назначить идентификаторы визуализируемому «li» через источник данных, что затрудняет выбор узла меню.

Любые идеи?


person Nick    schedule 20.02.2015    source источник
comment
Можете ли вы использовать более актуальную версию Кендо в своем проекте, чем в вашей скрипке (v. 2011.3.1129). Я могу помочь вам в версии 2012 Q3 SP1 или новее.   -  person Jarosław Kończak    schedule 22.02.2015


Ответы (1)


Не уверен, что Kendo API поддерживает запуск элемента выбора, но мне удалось щелкнуть пункты меню с помощью сочетаний клавиш с помощью JQuery.

Проверьте этот JSFiddle.

function clickMenuSpan(keyCode){
    var shortcut = String.fromCharCode(keyCode);

    $('#menu span.k-link').each(function(){
        var txt = $(this).text();

        if(txt.substr(-3) === '(' + shortcut + ')')
        {
            $(this).click();
        }

    })
}

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

 $(document.body).keydown(function (e) {
        var menu = $("#menu").kendoMenu().data("kendoMenu");
        if (e.altKey) {

            clickMenuSpan(e.keyCode);
        }
    });
person Shaan    schedule 22.02.2015
comment
Эй, спасибо за это. Я пошел другим методом. Я извлек все события из массива и использовал его индекс, что означало, что мне больше не нужно было загружать меню. Но это тоже хорошо выглядит - person Nick; 23.02.2015