PDA

View Full Version : Order of script tags (of views) in the index.html file...



GertBoers
30 Aug 2011, 12:47 AM
I was wondering if the order of the .js files is important in the index file, i mean the ones that refer to a view... I'm getting this error and i've got a feeling it's got something to do with the order of the files.

this is the error:

TypeError: 'undefined' is not a function (evaluating 'ToolbarDemo.views.Viewport.setActiveItem(ToolbarDemo.views.TabPanel)')

this is my source:

<link rel="stylesheet" href="stylesheets/sencha-touch.css" type="text/css" media="screen"/> <link rel="stylesheet" href="stylesheets/styles.css" type="text/css" media="screen"/>


<script src="sencha-touch-debug.js" type="text/javascript"></script>
<!-- app, models, stores, views, controllers [in that order!] -->
<script src="app/app.js" type="text/javascript"></script>

<script src="app/models/list_item.js" type="text/javascript"></script>

<script src="app/stores/brandstore.js" type="text/javascript"></script>

<script src="app/views/Viewport.js" type="text/javascript"></script>
<script src="app/views/tabpanel.js" type="text/javascript"></script>
<script src="app/views/logincard.js" type="text/javascript"></script>
<script src="app/views/essentialscard.js" type="text/javascript"></script>
<script src="app/views/homecard.js" type="text/javascript"></script>
<script src="app/views/ideascard.js" type="text/javascript"></script>
<script src="app/views/teamcard.js" type="text/javascript"></script>
<script src="app/views/brandbookcard.js" type="text/javascript"></script>
<script src="app/views/morecard.js" type="text/javascript"></script>

Thx!

mitchellsimoens
30 Aug 2011, 5:08 AM
The order doesn't matter unless you are extending each other.

Say you have 5 files and file2 extends file4 and file1 extends file5... the order you could use is:


file2
file3
file4
file5
file1

ITS Telco
30 Aug 2011, 5:10 AM
Hi,

the order is important.
I guess you have to change the order of

<script src="app/views/Viewport.js" type="text/javascript"></script> <script src="app/views/tabpanel.js" type="text/javascript"></script>

Good luck.
Thomas

mitchellsimoens
30 Aug 2011, 5:17 AM
The class one file is extending needs to be before that class. If you are using Ext.Application that file needs to be first as it creates all the namespacing.

GertBoers
30 Aug 2011, 5:42 AM
Thanks, I think i get it now...

But that's not what causing the errors apparently.

I'm having difficulties with my buttons. I keep getting errors like this:

TypeError: 'undefined' is not a function (evaluating 'ToolbarDemo.detailToolbar.setTitle(name)')


I just took an example app that was written in one index.js file, and then tried to split it up (MVC). But my buttons (or a list item that can be clicked on) stop working when i do that.
This is the file causing (one of ) the error(s):


ToolbarDemo.views.listPanel = Ext.extend(Ext.List, {
id: 'disclosurelist',
store: ToolbarDemo.ListStore,
itemTpl: '<div class="contact">{firstName} {lastName}</div>',
grouped: true,
indexBar: true,
onItemDisclosure: function(record, btn, index) {
var name = record.data.firstName + " " + record.data.lastName;
ToolbarDemo.detailToolbar.setTitle(name); //zet var naam in toolbar
ToolbarDemo.listDetailcard.update(record.data); //rendert de detailtpl
ToolbarDemo.views.Teamcard.setActiveItem('listdetailcard'); //springt naar detailcard
}
});


Ext.reg('listpanel', ToolbarDemo.views.listPanel);


Does it have something to do with the fact that detailToolbar is now in a separate file?

mitchellsimoens
30 Aug 2011, 5:48 AM
As long as it was created it shouldn't matter.

GertBoers
30 Aug 2011, 6:29 AM
I think it's created, this is the file:


ToolbarDemo.detailToolbar = new Ext.Toolbar({ items:[{
text: 'back',
ui: 'back',
handler: function() {
ToolbarDemo.views.Teamcard.setActiveItem(0,
{type:'slide', direction:'right'});
}
}]
});


Ext.reg('detailtoolbar', ToolbarDemo.detailToolbar);




i've made some changes, and now i also get this error when i start the app:
TypeError: 'undefined' is not an object (evaluating 'cls.prototype[this.typeName] = type')


I think i need to get a hang of some basics first:

- when do i have to use extend and when new?
- what does initComponent do and when to use it?

I know these kind of questions can be annoying, but if you can tell me where i can find some more on these subjects i'd be happy to read it there.

Thx!