2013-07-29 2 views
0

Я хочу показать текущее время в окне моего приложения, которое написано с использованием Extjs 3. Время должно обновляться каждую секунду, но я не знаю, как это сделать. это мой код: Может ли кто-нибудь мне помочь?Время обновления в extjs автоматически

function gettime(){ 
     var dt = new Date(); 
     dt = dt.format('h:i:s'); 
     return dt; 
    }; 

var clock = { layout:'form', frame:false, region:'center', height:100, width:400, 
items:[{id: 'currtime', xtype: 'displayfield',fieldLabel: 'Current Time' 
,value:gettime()}]}` 

ответ

1

Используйте или функцию TaskManager ваниль setInterval для запуска кода обновления периодически.

Редактировать

Пример:

// Keep a ref, in case you want to stop it later 
var task = Ext.TaskMgr.start({ 
    interval: 1000 
    ,run: function() { 
     Ext.getCmp('currtime').setValue(gettime()); 
    } 
}); 
+0

Можете ли вы привести мне пример? Я использовал setInterval, но это не сработало! – MSH

+0

Вы можете найти примеры в документах: http://docs.sencha.com/extjs/4.1.3/#!/api/Ext.util.TaskRunner http://www.w3schools.com/jsref/met_win_setinterval. asp –

+0

@msh См. мое редактирование. – rixo

0

Если вам не нужно каждую секунду, а каждую минуту вы можете сделать что-то вроде следующего, где бы вы только захватить время, когда минутные изменения:

(function startClock() { 
    var now = new Date(); 
    var sec = now.format('s'); 
    var runner = new Ext.util.TaskRunner(); 
    var task = function(dt) { 
     // start the interval 
     runner.start({ 
      run: function() { 
       Ext.getCmp('currtime').setValue(gettime()); 
      }, 
     interval: 60000 // 1 minute 
     }); 
    }; 

    Ext.getCmp('currtime').setValue(gettime()); // inital set time 
    Ext.defer(task, (60 - sec) * 1000, this, [now]); // get the time on next minute change 
})(); 
0

Этот код может помочь вам, я использовал ExtJS версии 4.2.1

Ext.onReady(function() { 

var filterPanel = Ext.create('Ext.panel.Panel', { 
bodyPadding: 5, 
width: 200, 
title: 'Update Time in ExtJS', 
items: [{ 
    fieldLabel: 'Time', 
    id: 'txtTime', 
    name: 'txtTime', 
    xtype: 'textfield' 
    } 
], 
renderTo: Ext.getBody() 
}); 

Ext.TaskManager.start({ 
    run: function() { 
     Ext.getCmp('txtTime').setValue(Ext.Date.format(new Date(), 'H:i:s')); 
    }, 
    interval: 1000 
}); 

}); 
Смежные вопросы