PDA

View Full Version : Adding Toolbar Item/Buttons via ComponentLoader



whodat
21 Feb 2015, 7:19 AM
Hi,
I'm trying to add Toolbar Buttons with a menu to a Toolbar via the ComponentLoader which makes an AJAX request.

The request hits the success callback but I'm not seeing the buttons loaded into the menu. Not sure if there is something manual I have to do.

My code and response are below. Any help with what I'm doing is wrong. Thanks



Ext.define('TGT.view.menu.AppMenu', {
extend : 'Ext.toolbar.Toolbar',
alias : 'widget.view.menu.targettrakmenu',
initComponent : function() {
this.callParent(arguments);
},
loader: {
url: '/buildUserMenu.json',
autoLoad: true,
loadMask: true,
success: function(loader, response) {
var toolbarItem = loader.getTarget();
toolbarItem = response.responseText;
console.log('successful ajax call to get menu items');
},
failure: function() {
console.log('failed ajax call to get menu items');
}
}
});




{
"items": {
"xtype": "button",
"text": "Home",
"iconCls": "edit-icon",
"iconAlign": "left",
"menu": {
"xtype": "menu",
"items": [
{
"text": "Homepage",
"iconCls": "edit-icon",
"itemId": "homepageItem"
},
{
"text": "User Profile",
"iconCls": "edit-icon",
"itemId": "userProfileItem"
}
]
}
}
}

whodat
21 Feb 2015, 12:18 PM
My JSON response was incorrect. I was using a java.util.Map with 'items' as the hash key. Should of just returned a List of toolbar buttons



{
"xtype": "button",
"text": "Home",
"iconCls": "edit-icon",
"iconAlign": "left",
"menu": {
"xtype": "menu",
"items": [
{
"text": "Homepage",
"iconCls": "edit-icon",
"itemId": "homepageItem"
},
{
"text": "User Profile",
"iconCls": "edit-icon",
"itemId": "userProfileItem"
}
]
}
}