Page 1 of 2 12 LastLast
Results 1 to 10 of 11

Thread: callback function and scope

  1. #1
    dddu88
    Guest

    Default callback function and scope

    Hi, all,
    I am experimenting ext 2.0 currently, still learning javascript, and having a problem basically related to javascript callback function, I tried all suggestions from the web and could not figure out a solution to the problem, I have a class function as following:

    Code:
      refreshProgress : function(){
               var cb = function(uploadInfo){
                      if (uploadInfo.inProgress)
                      {
                          alert(uploadInfo.bytesRead+':'+uploadInfo.totalSize);
                          var fileIndex = uploadInfo.fileIndex;
                          var progressPercent = Math.ceil((uploadInfo.bytesRead / uploadInfo.totalSize) * 100);
                           this.progress.updateProgress(progressPercent,
                           'upload in progress: ' + progressPercent + '%'+'...');
                           window.setTimeout(this.refreshProgress, 1000);
                      }
              };
           //var callcb = cb.call(this, uploadInfo);          
                 
          UploadMonitor.getUploadInfo(cb);
              
              
      },
    the UploadMonitor.getUploadInfo(cb) is a dwr call, the cb is a callback function, which is gotten called in my testing, but the error is this.progress is not defined, which I know is not defined in thie scope of the callback function, it is in the scope of the class, my quesition is how can I make class level function call inside this callback function?

    I tried call(this, uploadInfo), apply(this, uploadInfo), they all got complained about the uploadInfo not defined, which is supposed to be returned by the getUploadInfo call.

    Any solutions?

    Thanks very much for your help.

    David

  2. #2
    Ext User santosh.rajan's Avatar
    Join Date
    Sep 2007
    Location
    Kannur, Kerala, India
    Posts
    611
    Vote Rating
    0
      0  

    Default

    Code:
    UploadMonitor.getUploadInfo(cb.createDelegate(this));

  3. #3
    dddu88
    Guest

    Default

    Thanks for your response, it still said "this.progress has no preperty", do I need to other libraries for createDelegate function?

    The code:

    Code:
     
      refreshProgress : function(){
          //var self = this;
          //var cthis = this;
          var cb = function(uploadInfo){
                      if (uploadInfo.inProgress)
                      {
                          alert(uploadInfo.bytesRead+':'+uploadInfo.totalSize);
                          var fileIndex = uploadInfo.fileIndex;
                          var progressPercent = Math.ceil((uploadInfo.bytesRead / uploadInfo.totalSize) * 100);
                          this.progress.updateProgress(progressPercent,
                           'upload in progress: ' + progressPercent + '%'+'...');
                           window.setTimeout(this.refreshProgress, 1000);
                      }
              };
           //var callcb = cb.call(this, uploadInfo);          
                 
          UploadMonitor.getUploadInfo(cb.createDelegate(this));
    
      },
    Thanks again.

    David

  4. #4
    Sencha User Animal's Avatar
    Join Date
    Mar 2007
    Location
    Bédoin/Redwood City
    Posts
    30,862
    Vote Rating
    85
      0  

    Default

    That's just a good ol' fashioned bug in your code.

    What is "this" at the point you call the DWR function? That is what the "this" will be in the callback. Its "progress" property is undefined. Just break there in Firebug and see what you're doing wrong.
    Longtime Sencha engineer. Now surplus to requirements apparently...

  5. #5
    dddu88
    Guest

    Default

    Thanks for your advice, I found the 'this' in the call UploadMonitor.getUploadInfo(cb.createDelegate(this)) belongs to window instead of the my class which defines refreshProgress function, but in window scope, there is no progress property, progress is a property of my class, the call to refreshProgress() is the code:

    Code:
    window.setTimeout(this.refreshProgress, 1500);
    which resides in another class function, I donot know why this call changes the scope from my class to window, any idea how to fix?

    Thanks

    David

  6. #6
    dddu88
    Guest

    Default

    I got it working finally, this is the code inside my class function:

    Code:
    var refreshProgress = function(){
         
              var cb = function(uploadInfo){
                          if (uploadInfo.inProgress)
                          {
                              //alert(uploadInfo.bytesRead+':'+uploadInfo.totalSize);
                              var fileIndex = uploadInfo.fileIndex;
                              var progressPercent = Math.ceil((uploadInfo.bytesRead / uploadInfo.totalSize) * 100);
                              this.progress.updateProgress(progressPercent,
                               'upload in progress: ' + progressPercent + '%'+'...');
                               window.setTimeout(refreshProgress.createDelegate(this), 1000);
                          }
                  };
               //var callcb = cb.call(this, uploadInfo);          
    
              UploadMonitor.getUploadInfo(cb.createDelegate(this));
    
          };
           window.setTimeout(refreshProgress.createDelegate(this), 1500);
    Thanks very much, this forum is so helpfull for a beginner like me.

    David

  7. #7
    Sencha User Animal's Avatar
    Join Date
    Mar 2007
    Location
    Bédoin/Redwood City
    Posts
    30,862
    Vote Rating
    85
      0  

    Default

    Of course it "changes" the scope?

    There is absolutely no way for it to know what object to invoke the "refreshProgress" function with.

    Functions are passed as mere pointers.

    There is no scope information passed with them.

    You will need to use createDelegate to bind a scope to refreshProgress.
    Longtime Sencha engineer. Now surplus to requirements apparently...

  8. #8
    Sencha User Animal's Avatar
    Join Date
    Mar 2007
    Location
    Bédoin/Redwood City
    Posts
    30,862
    Vote Rating
    85
      0  

    Default

    Correct!
    Longtime Sencha engineer. Now surplus to requirements apparently...

  9. #9
    Sencha User Animal's Avatar
    Join Date
    Mar 2007
    Location
    Bédoin/Redwood City
    Posts
    30,862
    Vote Rating
    85
      0  

    Default

    Except that's a great use case for the TaskMgr:

    Code:
    this.updateProgressTask = Ext.TaskMgr.start({
        run: this.refreshProgress,
        interval: 1000,
        scope: this
    });
    Longtime Sencha engineer. Now surplus to requirements apparently...

  10. #10
    Sencha User Animal's Avatar
    Join Date
    Mar 2007
    Location
    Bédoin/Redwood City
    Posts
    30,862
    Vote Rating
    85
      0  

    Default

    And when you need to stop it:

    Code:
    Ext.TaskMgr.stop(this.updateProgressTask);
    Longtime Sencha engineer. Now surplus to requirements apparently...

Page 1 of 2 12 LastLast

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •