0

i've tried to get a return this from a callback, but i always get undefined.

here is the snipped

create: function(currentView, data){
    var itsMe = this; 
    this.thumbsWrapper = this.templates.wrapper().hide();
    currentView.append(this.thumbsWrapper);
    this.thumbsWrapper.fadeIn("fast", function(){
        return itsMe;                                                 
    });
},

var l = list().create(currentView); //need teh return that i can use chaining

the var l is now undefined, if i use the fadeIn with a callback... if i dont use fadeIn with the callback it returns the obj

anyone an idea why?

1
  • Because the callback returns the value to where it was called, which is somewhere inside .fadeIn. It has no effect on the create function. Jan 10, 2013 at 13:15

2 Answers 2

2

What @Felix Kling say is correct, you are not returning anything. If you want to return itsMe you will need to do:

create: function(currentView, data){
    var itsMe = this; 
    this.thumbsWrapper = this.templates.wrapper().hide();
    currentView.append(this.thumbsWrapper);
    this.thumbsWrapper.fadeIn("fast");
    return itsMe;    
}

Which should suffice if you want chaining.

If you want to get a reference to itsMe when the fadeout is finished, you will need to pass your own callback:

create: function(currentView, data, callback){
    var itsMe = this; 
    this.thumbsWrapper = this.templates.wrapper().hide();
    currentView.append(this.thumbsWrapper);
    this.thumbsWrapper.fadeIn("fast", function(){ 
        callback(itsMe);
    });  
}


list().create(function (that) {
    console.log("fade out complete");
    console.log("itsMe is", that);
});

And if you want to have a chaining pattern, which will execute the next function in the chain when fadeout is finished, you will need to pass not a reference to this but an object which can queue up commands, implement each command sequentially.

1

You need to return the object in the create() function, it is currently not returning anything:

create: function(currentView, data){
    var itsMe = this; 
    this.thumbsWrapper = this.templates.wrapper().hide();
    currentView.append(this.thumbsWrapper);
    this.thumbsWrapper.fadeIn("fast", function(){
        return itsMe;  //<--- this isn't going anywhere because you don't capture it                                               
    });
    return itsMe; //<------ return the object
},
3
  • Also note that because of the asynchronous nature of the animation functions, this function will return as soon as possible, i.e. as soon as the fade in animation is added to the animation queue. Jan 10, 2013 at 13:20
  • @MattiasBuelens thats true but is OK since he isn't doing anything or modifying itsMe in the fadeIn complete call.
    – MrCode
    Jan 10, 2013 at 13:25
  • Agreed, I just noted that because it wasn't exactly clear when the OP expected the create function to return. Jan 10, 2013 at 13:28

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.