PDA

View Full Version : Menu item with keyboard shortcut



zloi
2 May 2012, 4:45 AM
hi
the way to make menu keyboard shortcuts from the thread below works fine in ext-4.0.7
in ext-4.1 it is not working. Is this a bug or just my mistake?
http://www.sencha.com/forum/showthread.php?154304-Menu-items-with-right-aligned-keyboard-shortcut-descriptions
thank you.

scottmartin
2 May 2012, 9:10 AM
I would say contact the author, but I see you left a note on this thread. Most will update their components when the find the time or need it when they upgrade.

Have you tried to upgrade to 4.1 GA (final) instead of using RC3?

Regards,
Scott.

zloi
2 May 2012, 8:24 PM
thank you for your reply.


Ext.define('MyMenuItem', {
extend : 'Ext.menu.Item',
renderTpl: [
'<tpl if="plain">',
'{text}',
'</tpl>',
'<tpl if="!plain">',
'<a id="{id}-itemEl" class="' + Ext.baseCSSPrefix + 'menu-item-link mymenuitem-link" href="{href}" <tpl if="hrefTarget">target="{hrefTarget}"</tpl> hidefocus="true" unselectable="on">',
'<img id="{id}-iconEl" src="{icon}" class="' + Ext.baseCSSPrefix + 'menu-item-icon {iconCls}" />',
'<span id="{id}-textEl" class="' + Ext.baseCSSPrefix + 'menu-item-text mymenuitem-text">{text}</span>',
'<span class="' + Ext.baseCSSPrefix + 'menu-item-text mymenuitem-cmdTxt" <tpl if="menu">style="margin-right: 17px;"</tpl> >{cmdTxt}</span>',
'<tpl if="menu">',
'<img id="{id}-arrowEl" src="{blank}" class="' + Ext.baseCSSPrefix + 'menu-item-arrow" />',
'</tpl>',
'</a>',
'</tpl>'
],
onRender: function(ct, pos) {
// Intercept the call to onRender so we can add the
// keyboard shortcut text to the render data which
// will be used by the template
var me = this;
me.renderData = me.renderData || {};
me.renderData.cmdTxt = me.cmdTxt;
me.callParent(arguments);
}
});

here in onRender function we have me.cmdTxt value, but when we are in renderTpl the value of {cmdTxt} is not defined.

zloi
24 May 2012, 3:35 AM
I have found the solution!! In extjs 4.1 you just need to use beforeRender function instead onRender function.