Question

I set up a message box to display current time. The timer interval set as 1000, and there are 2 buttons to start and stop the ‘timer’. When click on the ‘stop’ button it calls the Ext.TaskManager.stop method and update the text in the message box to ‘paused’. However, when clicked the ‘stop’ button and the text changed to ‘Paused’ for just second, it changed back to display current time again. When i tried use Ext.TaskManager.stopAll(); instead of Ext.TaskManager.stop(task), it works! Why? My code as below:

<script type="text/javascript">
Ext.onReady (function(){
            var config={
            msg:'Display Time',
            modal:true,
            buttons:Ext.Msg.OKCANCEL,
            fn:displayTime
            }

        Ext.MessageBox.msgButtons[0].setText('Start');
        Ext.MessageBox.msgButtons[3].setText('Stop');                
        Ext.MessageBox.show(config); 
        function displayTime(id){
            if(id=='ok'){
                var task = {
                    run:function(){Ext.MessageBox.updateText ('????:' + Ext.util.Format.date(new Date(), 'Y-m-d g:1:s A'));},        
                    interval:1000                            
                    }                   
                Ext.TaskManager.start(task);
            }             
            else {
                Ext.MessageBox.updateText('Paused!');
                Ext.TaskManager.stop(task);
            }    
    };       
    });

Answer 1

The task is defined in the if so when the else is hit it is essentially running Ext.TaskManager.stop() which won’t stop your task. Move your task outside of the function declaration.

        var task = {
            run: function () {
                Ext.MessageBox.updateText('????:' + Ext.util.Format.date(new Date(), 'Y-m-d g:1:s A'));
            },
            interval: 1000
        }


        function displayTime(id) {
            if (id == 'ok') {
                Ext.TaskManager.start(task);
            } else {
                Ext.MessageBox.updateText('Paused!');
                Ext.TaskManager.stop(task);
            }
        };