attaching an array to an event in javascript?

Question

var image = [];

for (var i = 0; i < test.length; i++) {         
    image[i]= Titanium.UI.createImageView({ 
        top: row,
        image: avatar                                
    });             
    win.add(image[i]);
}

image[i].addEventListener('click', function (e) {
    alert('image number'+i);
});

im trying to attach an event to an array, but its saying object unidentfied! :)) whats wrong!!

Did you mean to have the addEventListener call outside of your for loop? As written, you are accessing an undefined element of your image array. — wmorrell
– wmorrell, Commented Feb 4, 2011 at 23:07
yeh i want outside, if put it inside it will assigned to the last element! — pingpong
– pingpong, Commented Feb 4, 2011 at 23:15

aorcsik · Accepted Answer · 2011-02-04 23:34:45Z

2

This is actually no new solution, just a correction for @Mahesh Velaga's answer:

var image = [];
for (var i = 0; i < test.length; i++) {         
    image[i]= Titanium.UI.createImageView({ 
        top:row,                 
        image:avatar                                
    });             
    win.add(image[i]);

    (function(i) {  // -- added (inti)

        image[i].addEventListener('click', function (e) {
            alert('image number'+i);
        });

    })(i);          // -- added (inti)
}

You need a closure around the eventListener for the i value to be local for its callback.

answered Feb 4, 2011 at 23:34

aorcsik

15.6k5 gold badges42 silver badges50 bronze badges

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

Comments

Mahesh Velaga · Accepted Answer · 2011-02-04 23:34:45Z

1

Your variable i is out of index

There is no image[test.length] and hence it throws the error (since i = test.length once the loop is exited)

Edit:

Try the following:

var image = [];
for (var i = 0; i < test.length; i++) {         
    image[i]= Titanium.UI.createImageView({ 
        top:row,                 
        image:avatar                                
    });             
    win.add(image[i]);
    setEventListner(i);
}

function setEventListener(index) {
    image[index].addEventListener('click', function (e) {
         alert('image number'+ index);
    });
}

edited Feb 4, 2011 at 23:34

answered Feb 4, 2011 at 23:08

Mahesh Velaga

22k5 gold badges41 silver badges60 bronze badges

4 Comments

wmorrell Over a year ago

The solution would appear to be to move the event listener attachment inside your loop...

pingpong Over a year ago

yeh i want outside, if put it inside it will assigned to the last element!

Mahesh Velaga Over a year ago

what do you mean by "if put it inside it will assigned to the last element!" ? You are adding a different event listener to each image, if you put it inside the loop.

aorcsik Over a year ago

There is still a problem with this. The for loop does not create a closure, so the i variable inside the eventListener will be global, and will always say the last value it was given. This is pingpong's problem.

Collectives™ on Stack Overflow

attaching an array to an event in javascript?

2 Answers 2

Comments

4 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

4 Comments

Your Answer

Sign up or log in

Post as a guest

Related