Auto Refresh DataStore di ExtJS

  Sewaktu saya sedang bermain main dengan pustaka javascript ExtJS, sempat terpikir dalam benak saya, bagaimana cara membuat suatu Object DataStore yang bisa melakukan autorefresh, semisal setiap 15 menit sekali. Feature auto refresh ini mungkin mirip dengan yang diterapkan yahoo email, facebook dan HotSuite. Sehingga dengan informasi yang kita ingin tampilkan akan selalu diupdate setiap beberapa waktu.

Idenya adalah Object DataStore tersebut akan melakukan refresh setiap 15 menit sekali. Untuk mekanisme refresh data tersebut kita akan memakai perintah DataStore.reload() dan menggunakan klas Ext.util.DelayedTask() untuk mengatur berapa lama sekali refresh dilakukan. Permasalahannya, dimana perintah ini akan di eksekusi ?

Object DataStore memiliki event datachanged yang akan berfungsi seperti ini, manakala DataStore menerima data, event ini akan bekerja. Cocok sekali jika kita letakkan perintah reload di area sini. Sehingga manaka DataStore menerima data, kita atur lagi perintah untuk melakukan reload 15 menit kemudian.

Untuk menit, javascript bekerja dalam satuan milisecond. Sehingga 15 menit = (1000 * 60) * 15.

Berikut adalah contoh object DataStore :

myDocDS = new Ext.data.Store(
                 {   url: 'http://localhost/application/',
                      baseParams: {p:"parameter", v:"variable"},
                      reader: new Ext.data.JsonReader(),
                      listeners:
                      {   datachanged: function()
                          {   t = new Ext.util.DelayedTask(function()
                              {  this.reload(); }, this).delay((1000*60)*15);
                          },
                      },
                 });

Selamat Mencoba

Author: Nareswara

Ordinary People with eye glasses

Leave a Reply

Your email address will not be published. Required fields are marked *