Konsep Javascript ExtJS Extended JavaScript
width : 500, height : 400,
initEvents : function{ MainPanel.superclass.initEvents.callthis;
} more action handler for this panel
};
Code diatas adalah contoh class turunan MainPanel dari class TabPanel. Dalam class ini membolehkan deklarasi method dan property. Contoh property adalah
width, dan height, sementara contoh method adalah initEvents. Kelebihan dari ExtJs konsep AJAX yang digunakan, dibuat sederhana
sehingga mudah digunakan namun jangan mengharapkan koneksi antara client - server akan seperti koneksi client-servernya applikasi desktop biasa non-
webbase karena memang inilah AJAX asynchronous JavaScript and XML. Asynchronous ini yang harus diperhatikan karena koneksi internet bukanlah
koneksi yang besifat terus menerus yang menjadi dasar dari hubungan asynchronous. code yang sederhana bisa membuat suatu aplikasi yang menarik.
tampilan yang dahulu hanya bisa di buat di desktop base application, sekarang bisa di buat pada web based application menggunakan ExtJs. kelebihan lain dari
ExtJs yaitu memiliki cross browser compatibility yang bisa menangani compatibility antar browser.
web application development juga lebih mudah karena beberapa hal : o
Cross browser compatibility yaitu perbedaan interpretasi browser terhadap source code javascript.
o Dalam extjs terdapat script eventHandler. interaksi dengan user dan browser
dilakukan via eventHandler. Yaitu menghandle setiap kali ada event kaya user
keystrokes, mouse click dan monitoring window dalam browser kaya windows resize atau perubahan font.
o Extjs memakai script AJAX yang berfungsi untuk handle request ke atau dari
server. komunikasi dengan server akan dilakukan di background tanpa perlu refresh-refreshan lagi.
Pengambilan data oleh client frontend-ExtJs terhadap server backend dilakukan dengan menggunakan objectnya ExtJs Ext.data.Store dengan konsep
AJAX, dilakukan dengan proses delay yang secara default dilakukan selama 30 second, apa bila proses data yang dilakukan oleh server melebihi batas waktu
tersebut maka data store tidak mengembalikan nilai apa-apa dikarenakan terputusnya koneksi tersebut, untuk itu perlu kiranya menambah waktu untuk
delay agar benar-benar client mendapatkan reponse dari server dimana waktu tersebut disesuaikan dengan lamanya server memproses data, adapun contoh
script nya adalah sebagai berikut :
var store_tot = new Ext.data.Store{ proxy: new Ext.data.HttpProxy{
url: ....phpgetDashboard-data.php?load=grid ,timeout:100000
}, reader: reader_grid
}; store_tot.load{
callback: functionopts, success, response {
if success {doOCF;} }}
Pada script di atas koneksi dilakukan dengan menggunakan metode proxy dan menset waktu tunggu sebanyak 10.000 second, dengan asumsi server
memproses hingga menghasilkan data kurang dari 10.000 second dan apabila di bawah waktu itu server telah mersepon maka proses tinggu dari data store di
hentikan. Response diterima oleh client terdiri dari 3 paket yaitu totalCount, data,
dan success dimana nilai-nilai tersebut menjadi salah satu standar yang diterapkan oleh ExtJs untuk data yang dihasilkan oleh server, berikut ini adalah contoh script
PHP untuk respon server :
nodes[totalCount]=7; nodes[transaksi]=el;
nodes[success]=true; echo json_encodenodes;