PDA

View Full Version : MVC: move login from "view" to "controller"



Crockford
3 Sep 2011, 1:26 PM
MVC: move logic from "view" to "controller"

Hi everyone.
I have some issues trying to move logic from a view to a controller

This is my View


Ext.define('Mvc.test.view.MainMenuList', {
extend: 'Ext.view.View',
alias: 'widget.mainmenulist',
store: 'Mvc.test.store.MenuList',
tpl: new Ext.XTemplate('<tpl for="."><div class="menuItem menuItem{pk}"><span>{title}</span></div></tpl>'),
itemSelector: 'div.menuItem',
listeners: {
itemclick: function (el, objModel, node) {
console.log(el);
}
}
});

I have added a event manager for the "itemclick" event and it works well.

I don't like it. It would be cool if I could move it to a controller.

I have done this:



Ext.define('Mvc.test.controller.MenuController', {
extend: 'Ext.app.Controller',
views: ['Mvc.test.view.MainMenuList'],
init: function () {
this.control({
'mainmenulist': { //<-- HERE! What must I use as component query?
click: function () { console.log('click event raised'); }
}
});
}
});

The event click is never raised. Do you have some suggestion?

skirtle
3 Sep 2011, 5:53 PM
Isn't it itemclick rather than click?

Also, are you sure you've included your controller in the app? Can you try putting some console logging in init() to make sure?

Crockford
3 Sep 2011, 10:59 PM
Isn't it itemclick rather than click?

Also, are you sure you've included your controller in the app? Can you try putting some console logging in init() to make sure?
Thank you Skirtle for the answer.
The init() method is correctly executed tested by a console.log('debug').

I think that my error is in the query.


this.control({
'mainmenulist': {
click: function () { console.log('gog og ogog'); }
}
});


because my query listens clicks on the container (mainmenulist) not the single item inside. But after a lot of try I have no found a way to listen click over the items inside container. I show you an image to explain better.

27842

skirtle
3 Sep 2011, 11:11 PM
I don't understand. Ext.view.View doesn't have a click event, it has an itemclick event:


this.control({
mainmenulist: {
itemclick: function () { console.log('gog og ogog'); }
}
});

Are you saying that this isn't what you want?

Crockford
3 Sep 2011, 11:27 PM
Thank you skirtle,
I know that I had to use itemclick event but... I was lost debugging and changing.

Thank you for addressing me to the solution.