Konfigurasi Extjs

1. Masuk ke direktori asset
2. create new file *.js di app/billing/panel/
3. paste code yang ada di extjsdesigner
4. copas sample code yang ada di CenterPanel.js (ambbil 4 baris paling atas)

before
----------
Ext.define('billing.panel.CenterPanel', {
extend : 'Ext.tab.Panel',
alias : 'widget.billing.panel.CenterPanel',
id : 'centerpanel',

5. Paste kedalam file *.js yang baru saja di buat , edit :
- nama class
- alias
- id

after
----------
Ext.define('billing.panel.TariffGroupPanel', {
extend : 'Ext.tab.Panel',
alias : 'widget.billing.panel.TariffGroupPanel',
id : 'billing.panel.TariffGroupPanel',

6. edit constuctor yang ada di file *.js yang dibuat
contoh :
before
-----------
MyPanelUi.superclass.initComponent.call(this);
after
-----------
billing.panel.TariffGroupPanel.superclass.initComponent.call(this);

7. Linking ke menu yang ada di file billing/pannel/MainPanel.js
contoh :
{
text : 'Tariff Group',
scope : this,
handler : function(item){
Ext.getCmp('centerpanel').displayScreen(item.screenType);
},
screenType : 'billing.panel.TariffGroupPanel'
}

8. Tambahkan include yang ada di app.js

// Specify a list of classes your application your application needs
Ext.require([
[..]
'billing.panel.TariffGroupPanel',
[..]
]);

9. Upload dan testing menggunakan firebug

Posted in: Tutorial