jpatten
10 Jan 2012, 6:11 AM
I'm new to Ext JS, so bare with me. I'm trying to construct a panel, containing page navigation items, with accordion layout, dynamically.
I'd like to populate the items within this panel according to data retrieved from a data store.
Within my NavigationController class, I'm retrieving my navigation items through a callback following a store load, like this:
onLaunch: function() {
var navigationStore = this.getNavigationStore();
navigationStore.load({
callback: this.onNavigationLoad,
scope: this
});
},
onNavigationLoad: function() {
for (var i = 0; i < this.getNavigationStore().count(); i++) {
this.getNavigationSectionModel().load(i, {
success: function(nav) {
console.log("Loaded nav section: " + nav.get('name'));
nav.navItems().each(function(item) {
console.log("Loaded nav item 1: " + item.get('name'));
});
// TODO: create new panel and add to NavigationPanel
}
});
}
}
I'm not sure this is the best way of doing this. I've tried constructing panels for each navigation item, and then, for each panel:
var navPanel = Ext.getCmp('navigationPanel');
navPanel.add(newPanel)
This seems to have no effect however. Am I approaching this in the right way?
Thanks
I'd like to populate the items within this panel according to data retrieved from a data store.
Within my NavigationController class, I'm retrieving my navigation items through a callback following a store load, like this:
onLaunch: function() {
var navigationStore = this.getNavigationStore();
navigationStore.load({
callback: this.onNavigationLoad,
scope: this
});
},
onNavigationLoad: function() {
for (var i = 0; i < this.getNavigationStore().count(); i++) {
this.getNavigationSectionModel().load(i, {
success: function(nav) {
console.log("Loaded nav section: " + nav.get('name'));
nav.navItems().each(function(item) {
console.log("Loaded nav item 1: " + item.get('name'));
});
// TODO: create new panel and add to NavigationPanel
}
});
}
}
I'm not sure this is the best way of doing this. I've tried constructing panels for each navigation item, and then, for each panel:
var navPanel = Ext.getCmp('navigationPanel');
navPanel.add(newPanel)
This seems to have no effect however. Am I approaching this in the right way?
Thanks