Including different js file to load the extjs component

[madhusanmani]

Hi All,

In my application i need to display the same panel with diff data in different pages.
so i am trying to create a common panel.js file and try to include in all the files. but while doing this i am getting the following error.

"An uncaught error was raised: "The following classes are not declared even if their files have been loaded: 'Ext.ux.forexDetails'. Please check the source code of their corresponding files for possible typos: 'js/forexra/pages/forexDetails.js'"."


Ext.Loader.setConfig({
enabled: true
});
Ext.Loader.setPath('Ext.ux', 'js/forexra/pages');


Ext.require([
'Ext.ux.forexDetails'
]);



Ext.onReady(function(){
// second tabs built from JS
var advSearch1 = new Ext.form.FormPanel({

width: 930,
height: 565,
frame: true,
autoScroll: true,
autoHeight:true,

items: [{
xtype:'tabpanel'
,activeItem:0
,border:false


}
,items:[{
title:'Forexra List',
id:'activeList',
items:[testPanel]
},{
title:'Deleted List',
id:'inactiveList',
items:[testPanel],
disabled:true
}],
listeners: {

}
}
]

});


advSearch1.render('mydiv1');
})

======================================================================
This is the common Panle js file
======================================================================


Ext.Loader.setConfig({
enabled: true
});
Ext.Loader.setPath('Ext.ux', 'js/forexra/ux');

Ext.require([

])
Ext.onReady(function(){

testPanel = new Ext.FormPanel({
title: 'Forex Details',
standardSubmit: true,
frame:true,
width: 950,
height: 635,
border:0,
defaults: {
width: 100,
align:'right'
},

defaultType: 'button',
items: [

]
});
});

Please help me.

[jay@moduscreate.com]

Your problem is that you're not following the best practices when it comes to using Ext.Loader. I have a great writeup here: http://www.sencha.com/blog/using-ext...r-application/

[madhusanmani]

Thanks a lot for qucik and very usefull solution..

Thanks,
Madhu