Showing a loading gif into grid cell on runtime

I have a grid.Panel with some records, when a record is selected then a button in a ToolBar is enabled so I can start a "Long Running Process" on server side, so I need to show in cell (of that row) a Loading icon.


First I will show a Messagebox that will say "Initializing...", on that phase the server will log the task in a Queue so a Windows Service can catch that later. When the server returns a "success" then I hide the messagebox but now the Loading icon should be visible until the Long Running Process ends (maybe after 2 hours).


This button label is "Start Process".


On button click I have the following code:

Code:

onButtonClickProcess: function (button, e, options) {        console.log('start process');        Ext.MessageBox.show({            title: 'Please wait',            msg: '...',            progressText: 'Initializing...',            width: 300,            progress: true,            closable: false,            wait: true,            waitConfig: { interval: 200 }        });        var row = this.getGrid().getSelectionModel().getSelection()[0];        Ext.Ajax.request({            url: '/api/TimeSheet/QueueTask',            method: 'GET',            params : {                "timesheetId" : row.get("TimesheetImportId")            },            success: function (response, opts)            {                Ext.MessageBox.hide();                // TODO:                // Here I have to show the loading icon into my row cell ??            },            failure: function (response, opts)            {                Ext.MessageBox.hide();            }        })    },

Any clue on how to do that?