2015-02-20 3 views
1

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

я могу продемонстрировать in this fiddle именно то, что я ищу

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» через источник данных, что затрудняет выбор узла меню.

Любые идеи?

+0

Можете ли вы использовать более реальную версию на Kendo в своем проекте, как это делается в вашей скрипке (v. 2011.3.1129). Я могу помочь вам в версии 2012 Q3 SP1 или новее. –

ответ

0

Не уверен, поддерживает ли 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(); 
     } 

    }) 
} 

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

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

      clickMenuSpan(e.keyCode); 
     } 
    }); 
+0

Эй, спасибо за это. Я пошел другим методом. Я извлек все события из массива и использовал индекс, что означало, что мне больше не приходилось загружать меню. Но это тоже выглядит хорошо – Nick

Смежные вопросы