PDA

View Full Version : controllers and views



vivendi
13 Oct 2011, 3:46 AM
I'm trying to create a basic mvc app with sencha touch 2. I have a few basic parts ready. The app.js and a controller, which load and run good. But all i need to do now is to add a view. But this is where the problem starts.

When i try to add a view to my controller, then it displays the following error in console:


GET file:///xcode/TEST_MVC/www/AM/view/User.js?_dc=1318501436195


I have no idea why i'm getting this error. As far as i can see i did exactly what the example apps are doing.

Please take a look at my code:

This is my controller:


Ext.define('AM.controller.Main', {
extend: 'Ext.app.Controller',
views: ['User'], // <--- This is causing the error
init: function() {
this.control({
console.log("init");
});
},

});


And this is my view:


Ext.define('AM.view.User' ,{
extend: 'Ext.Panel',
fullscreen: true,
html: 'dfgfahsg'
});


So when i remove this line from my controller:
views: ['User']

Then my app runs fine, without errors... But that is how i try to 'add' my view to my controller.
For some reason it then looks in the "/AM/" folder, which is just the name i defined in app.js.

Anyone any idea what i'm doing wrong here...?

vivendi
13 Oct 2011, 6:25 AM
Just figured out i was still adding <script> references to my .js files. Which ofcourse isn't needed with sencha touch 2 :-|

Anyway, now i'm trying to load a panel (which are called Components now?) from a view. But it's not showing.

This is my app.js


Ext.Loader.setConfig({ enabled: true });

Ext.application({
name: 'AM',
appFolder: 'app',
controllers: [
'Main'
],
launch: function() {
Ext.create('Ext.viewport.Viewport', {
fullscreen: true,
items: {
xtype: 'userlist'
}
});
}
});


This is my controller:


Ext.define('AM.controller.Main', {
extend: 'Ext.app.Controller',
views : ['User']
});


And this is my view:


Ext.define('AM.view.User', {
extend: 'Ext.Component',
xtype: 'userlist',
html: 'aafgvhfghfghfghfa'
});



But for some reason the 'User' view isn't showing. I do see that my background has the faint grey tint, which indicates Sencha loaded succesfully.

But if i change the "items:" in app.js to this, then a panel renders just fine:


...
items: [
//xtype: 'userlist'
xtype: 'panel',
title: 'Users',
html : 'List of users will go here'
}
...


So my question basically is, how can i render a panel when it is in a separate file like i have now (User.js)???

parky128
13 Oct 2011, 6:41 AM
I am also facing this problem as posted here in the Q&A forum => http://www.sencha.com/forum/showthread.php?150720-Problem-with-using-a-custom-xtype-in-item-declaration-of-Tabpanel

vivendi
13 Oct 2011, 6:58 AM
I am also facing this problem as posted here in the Q&A forum => http://www.sencha.com/forum/showthread.php?150720-Problem-with-using-a-custom-xtype-in-item-declaration-of-Tabpanel

Just looked at your example and noticed you're trying to load a tabPanel. So i changed my view to this:



Ext.define('AM.view.User', {
extend: 'Ext.TabPanel',
xtype: 'userlist',
items: [{
xtype: 'panel',
html: 'djhfdsjk'
}]
});


Now when i launch my app then i DO see a toolbar at the top of my page, but i don't see the html content below that... So if anyone has any idea..

parky128
13 Oct 2011, 7:04 AM
Yeah I can only conclude its something to do with the xtype lookup not working correctly. I have an ExtJS 4 MVC app laid out in a similar manner which works fine, so I'm a bit stumped!

TommyMaintz
13 Oct 2011, 7:57 AM
Vivendi, could you maybe zip up your app and post it? The easiest way for us to debug this is to get the exact same app (structure + code).

vivendi
13 Oct 2011, 9:58 AM
Vivendi, could you maybe zip up your app and post it? The easiest way for us to debug this is to get the exact same app (structure + code).

Sure thing, i'll post it tomorrow when i have access to my mac again.

parky128
13 Oct 2011, 10:32 AM
Vivendi - Hope you dont mind me butting in here, but see my attached app attached for you guys to debug, having same xtype related issues as mentioned in my earlier post on this thread.

TommyMaintz
13 Oct 2011, 11:52 AM
I haven't tried the app yet, but I see you guys are not using the config object in the view definitions. Does the answer in this thread help fix the problem?

http://www.sencha.com/forum/showthread.php?150720-Problem-with-using-a-custom-xtype-in-item-declaration-of-Tabpanel

parky128
13 Oct 2011, 11:56 AM
Yes, sorry I have posted in both forums with the same problem. Thanks again for your help here!