PDA

View Full Version : Addition of second listener causes the first to stop working



cmgreen
1 May 2012, 1:06 PM
I am currently setting up my first app using the MVC architecture. I have a set of panels for navigation that when you expand or collapse them the corresponding view is shown. I am using a Viewport with the navigation panels positioned in the west region and the views already hidden in the center region. I simply call a hide or show to achieve the functionality I want. Inside of the control method for the controller I have set up two listeners that reference the title attribute of the two panels. Using the expand and collapse panel events I call the hide or show. When I add the second listener for the second panel and run the app then the first panel will no longer show or hide its view anymore. I've attempted to give ids to these panels from the view and then reference them in the controller, but the behavior is the same. With the title attribute being unique I thought it would fire off the correct set of functions.

Can someone shed some light on why the first listener has quit firing?

Navigation.js (Controller)

Ext.define('ITWAC.controller.Navigation', {
extend: 'Ext.app.Controller',

views: ['navigation.Window', 'pr.PRGrid', 'pr.Requisition']




refs: [{


ref: 'req',


selector: 'prrequisition',


ref: 'inv',


selector: 'prgrid'


}],


init: function() {

this.control({


'navmenu > panel[title=Purchase Requisition]': {


expand: this.showPanel,


collapse: this.hidePanel


},


'navmenu > panel[title=Inventory]': {


expand: this.showGrid,


collapse: this.hideGrid


},


});


},

showPanel: function() {

this.getReq().show();


},

hidePanel: function() {

this.getReq().hide();


},

showGrid: function() {

this.getInv().show();


},

hideGrid: function() {

this.getInv().hide();


}


});

Window.js (Navigation panel)

Ext.define('ITWAC.view.navigation.Window', {
extend: 'Ext.panel.Panel',

alias: 'widget.navmenu',

title: "Info Tech Warehouse Access Center",

layout: 'accordion',


items: [

{


xtype: 'panel',


title: 'Purchase Requisition',


},


{


xtype: 'panel',


title: 'Inventory',


},


{


xtype: 'panel',


title: 'IT Stock',


},


{


xtype: 'panel',


title: 'VClip',


},


{


xtype: 'panel',


title: 'Admin'


}


],

initComponent: function() {

this.callParent(arguments);

}

});

vietits
1 May 2012, 3:55 PM
Your problem is not at events. They work well. The problem is at refs definition. Try to fix it as below:


refs: [{
ref: 'req',
selector: 'prrequisition',
},{ // <- You missed this and this cause problem.
ref: 'inv',
selector: 'prgrid'
}],

cmgreen
2 May 2012, 5:38 AM
Thanks vietits. That fixed my problem. The app works exactly the way I need it to now. I just had been looking at the code so long I couldn't see what was right in front of my face. I have the new book by Loiane Groner, but her example in the MVC chapter only shows one ref. I've gone back and looked at the syntax on the feed viewer example in the sdk and there it is. I will have to remember the curly braces when dealing with arrays.

Thanks again.

pabramowitsch
1 Aug 2012, 12:59 PM
I have a panel with several sliders and lists and a lot of interaction. Its controller has a refs section built in this way

refs : {
symptomList : '#symptomList',
classifierList : '#classifierList',

intensity: '#sldIntensity',
occur: '#sldOccur',
},

All the events seem to work fine the first time around, but when I pop the panel from its navigation view and later rebuild and push it back onto the navigation view, none of the events fire. Looking at the DOM, the objects whose ids are referred to in refs, are present and visible. I tried the syntax suggested in this thread, but now none of the events fire even the first time, and I get a deprecated warning in the log.

refs : [{ref: 'symptomList', selector : '#symptomList'},
{ref: 'classifierList' , selector : '#classifierList'},
{ref: 'store' , selector : '#symtomstore'},
{ref: 'intensity' , selector : '#sldIntensity'},
{ref: 'occur' , selector : '#sldOccur'},
],

Do I need to remove the events somehow before popping the panel so they don't get duplicated?

- P