CODEWITHSUNDEEP
javascriptjquerypromise
Lukas
Lukas

Reputation: 7734

Cannot read property 'promise' of undefined

I have this code: 

var someFunction = {
    option01 : function($el){
      $el.css('color', 'red');   
    },
    option02 : function($el){
      $el.css('background-color', 'blue');
    }    
}

var my_div = $('.my_div');

someFunction.option01(my_div).promise().done(function() {
    console.log('option01 done');

    someFunction.option02(my_div);
});

I'm trying to reach some promise dependency, but regarding this code i have an error, which is: Uncaught TypeError: Cannot read property 'promise' of undefined. Can anybody help?

Upvotes: 0

Views: 8036

Answers (3)

aamir sajjad
aamir sajjad

Reputation: 3039

please find below the link of working Plunker example

there was an error in selector, as string not closed. may be it was typo.
return statement missing>
var my_div = $('.my_div');

http://plnkr.co/edit/3OJRF2wviNnX63jeH3aH?p=preview

var someFunction = {
  option01: function($el) {
   return $el.css('color', 'red'); 
  },
  option02: function($el) {
  return $el.css('color', 'blue');  

  }
}


$(function(){
var my_div = $('.my_div');

someFunction.option01(my_div).promise().done(function() {
    someFunction.option02(my_div);
});

});

Upvotes: 0

Mattias Buelens
Mattias Buelens

Reputation: 20179

This doesn't make any sense.

First of all, .promise() is a method of a jQuery object, but option01 doesn't return a jQuery object (in fact, it doesn't return anything). If you want option01 to return $el, just do that:

option01 : function($el){
  $el.css('color', 'red');
  return $el;
}

Or, since .css is chainable:

option01 : function($el){
  return $el.css('color', 'red');
}

More importantly though, I don't see why you need promises at all. Promises are helpful when a function starts something which produces a result later on. For example, when a function starts an animation or an AJAX request, it can return a promise for when that animation/AJAX is completed.

option01 doesn't do anything long running (such as an animation or an AJAX request). The .css calls take effect immediately, they're done as soon as they return. Therefore, when option01 returns, it's simply done... so you can just do:

someFunction.option01(my_div);
someFunction.option02(my_div);

I'm just not sure what you're trying to achieve here. Is your sample code sufficiently representative for what those functions should actually be doing?

Upvotes: 2

A. Wolff
A. Wolff

Reputation: 74410

You are not returning anything from functions, you need to return the element:

var someFunction = {
    option01 : function($el){
      return $el.css('color', 'red');   
    },
    option02 : function($el){
      return $el.css('background-color', 'blue');
    }    
}

But then not sure what you are looking for here, using promise().

Upvotes: 0

Related Questions