Question

I have this piece of code:

this.json.each(function(obj, index) {
    var li = new Element('li');
    var a = new Element('a', {
        'href': '#',
        'rel': obj.id,
        events: {
            'click': function(e) {

                this.doSteps(this.step + 1); // <-- causing issue

            }
        }   
    });
    var img = new Element('img', {
        'src': imgd + obj.img,
        'alt': obj.name                        
    });
    img.inject(a);
    a.inject(li);
    li.inject(ul);
});

I get an error of “this.doSteps is not a function” in the console. Can somebody please help me with this and explain the resolution.

Thanks in advance.

Answer 1

Try capturing it in a closure:

var li = new Element('li');
var _self = this;
var a = new Element('a', {
    'href': '#',
    'rel': obj.id,
    events: {
        'click': function(e) {

            _self.doSteps(_self.step + 1); // <-- causing issue

        }
    }   
});