View Full Version : [3.x/2.x] MenyKeyTrigger - A plugin to allow you to trigger menu items from letters

9 Mar 2010, 6:48 PM
After much frustration with not having this feature, I developed a plugin to allow that allows you to attach a key (letter) for which to trigger the handler of an ExtJS Menu item. I call it Ext.ux.TDGi.MenuKeyTrigger (http://github.com/tdgi/Ext.ux.TDGi.MenuKeyTrigger). I cannot tell you enough how many times I wished this was in some of the Ext JS applications I was developing and testing.

As an avid keyboard junkie, I really hate to have to move the mouse a lot. Hell, being an OS X user, there is much to be desired with the UI in this arena, especially after using Windows since 3.0 and getting spoiled with its well-baked accessibility features.

I developed this plugin about 8 months ago, but have had little time to really polish it due to the the work on my book, Ext JS in Action (http://extjsinaction.com/). But with that nearing completion, Iíve taken the time to release it tonight in itís beta form, in hopes that I could get some feedback to improve it. http://tdg-i.com/wp-includes/images/smilies/icon_smile.gif

Blog URL: http://tdg-i.com/313/introducing-ext-ux-tdgi-menukeytrigger-a-menuitem-key-triggering-plugin

Demo: http://tdg-i.com/js/examples/ext3/plugins/MenuKeyTrigger/

GitHub repo: http://github.com/tdgi/Ext.ux.TDGi.MenuKeyTrigger


9 Mar 2010, 11:00 PM
hi jay,

i am a bit short in time right now (polishing the fm-demo), so i will test this plugin later.

i am a big fan of key-accesibility too, so this is a really good idea for making navigation faster. one suggestion:

text : '<u>C</u>ut',
handler : handler,
triggerKey : 'c'

It would be really sweet, if the underlining is generated automatically. Otherwise getting the text of an item must use stripTags(). An alternative could be, to add a param for the position of the letter to underline (triggerKeyPos : 2).

good job,

10 Mar 2010, 6:16 AM
Thanks Tobi.

Look at the example code, I have something stubbed for the future already ;)

text : '<u>O</u>pen',
handler : handler,
triggerKey : 'o'
/* for the future */
// triggerKey : {
// character : 'o',
// instance : 1
// }

10 Mar 2010, 9:11 AM
nice Work