JavaScript code not working within a callback

Question

In the following JavaScript code, if warnBeforeNew is false, the file open code works. However, it doesn't if warnBeforeNew is true, instead giving an error "Uncaught TypeError: Cannot read property 'root' of undefined".

I don't know if this is to do with scoping, but how do I get the file loading code to work within the callback? Thanks.

Editor.prototype.open = function(path) {
  if (Editor.warnBeforeNew==true){
    this.showDialog({
        dialogLabel: 'You have unsaved changes. Are you sure you want to discard them and open a different file?',
        submitLabel: 'Discard',
        cancelLabel: 'Cancel',
        submitCallback: function() {
          Editor.warnBeforeNew=false;
          this.filesystem.root.getFile(path, {}, this.load.bind(this), error.bind(null, "getFile " + path));
        }
    });
  } else {
    this.filesystem.root.getFile(path, {}, this.load.bind(this), error.bind(null, "getFile " + path));
  }
};

Denys Séguret · Accepted Answer · 2013-08-18 13:13:44Z

2

You have to save the value of this because when the callback is called, it's with a different receiver than the external function :

if (Editor.warnBeforeNew==true){
    var thing = this; // choose a more meaningful name if possible...
    this.showDialog({
        dialogLabel: 'You have unsaved changes. Are you sure you want to discard them and open a different file?',
        submitLabel: 'Discard',
        cancelLabel: 'Cancel',
        submitCallback: function() {
          Editor.warnBeforeNew=false;
          thing.filesystem.root.getFile(path, {}, thing.load.bind(thing), error.bind(null, "getFile " + path));
        }
    });
  } else {
    this.filesystem.root.getFile(path, {}, this.load.bind(this), error.bind(null, "getFile " + path));
  }

edited Aug 18, 2013 at 13:13

answered Aug 18, 2013 at 12:52

Denys Séguret

384k90 gold badges813 silver badges780 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

Bergi Over a year ago

You forgot to replace this with thing in the bind

Bergi · Accepted Answer · 2013-08-18 13:00:00Z

0

The submitCallback to your showDialog method needs to be bound, too - it accesses this.filesystem.root.… which fails.

this.showDialog({
    …,
    submitCallback: function() {
      Editor.warnBeforeNew=false;
      this.filesystem.root.getFile(path, {}, this.load.bind(this), error.bind(null, "getFile " + path));
    }.bind(this)
//    ^^^^^^^^^^
});

answered Aug 18, 2013 at 13:00

Bergi

671k162 gold badges1k silver badges1.5k bronze badges

Comments

Karthik Ar · Accepted Answer · 2013-08-18 14:01:40Z

0

Try to catch the scope out side the callback and use it.

Editor.prototype.open = function(path) {
var that=this;
  if (Editor.warnBeforeNew==true){
    this.showDialog({
        dialogLabel: 'You have unsaved changes. Are you sure you want to discard them and open a different file?',
        submitLabel: 'Discard',
        cancelLabel: 'Cancel',
        submitCallback: function() {
          Editor.warnBeforeNew=false;
          that.filesystem.root.getFile(path, {}, that.load.bind(that), error.bind(null, "getFile " + path));
        }
    });
  } else {
    this.filesystem.root.getFile(path, {}, this.load.bind(this), error.bind(null, "getFile " + path));
  }
};

edited Aug 18, 2013 at 14:01

answered Aug 18, 2013 at 12:56

Karthik Ar

1256 bronze badges

2 Comments

Bergi Over a year ago

You forgot to replace this with that where the load method is bound

Karthik Ar Over a year ago

ya you are right that.filesystem.root.getFile(path, {}, that.load.bind(that), error.bind(null, "getFile " + path));

Collectives™ on Stack Overflow

JavaScript code not working within a callback

3 Answers 3

1 Comment

Comments

2 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

1 Comment

Comments

2 Comments

Your Answer

Sign up or log in

Post as a guest

Related