I need to add a newly-created MenuItem at runtime; so my code currently looks like:
var myMenu = myCmp.query('mymenu')[0]; // retrieve my only Menu object
var menuItem = Ext.create('Ext.menu.Item', {
itemId: 'myItemId', text: 'textGoesHere'
});
myMenu.add(menuItem);
I'm using the add
method to add the item; but nothing happens to the menu items though at run-time. Even though debugging shows that the new item has actually been added to the items
config of the Menu instance.
Using the remove
method however does work, at run-time.
Question: How to make the newly added MenuItem show at runtime? What am I missing?
UPDATE: the above code works; I had a flawed switch statement that was causing another pass through the logic, removing the last created menuItem.
Comment bump up
The OP wrote
OK I track the issue down; I had a flawed switch statement that was causing another pass through the logic, removing the last created menuItem. Still I'll mark your answer as correct as it works as well (by passing the config obj).
This example works:
var menu = Ext.create('Ext.menu.Menu', {
width: 100,
height: 100,
floating: false, // usually you want this set to True (default)
renderTo: Ext.getBody(), // usually rendered by it's containing component
items: [{
text: 'icon item',
iconCls: 'add16'
},{
text: 'text item'
},{
text: 'plain item',
plain: true
}]
});
menu.add({text:'test'});
I am not quite sure but according to the API the Menu has panel as default type when you look at the menu but it seems to be menuitem according to the menuitem API
This might be a little confusing.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With