How to set the unique id for element in the loop with Mootools?

Question

Hi,i need to set the unique numeric rel attributes for anchor elements in table with class "tdresult". Im trying to set them in the loop, but im not very good at Javascript and probably don't undestood loops.

$$('.tdresult').each(function(chooseClass) {
    var ellen=chooseClass.getElements('a').length;
    var eli=chooseClass.getElements('a').each(function(el){
    for (i=0; i<ellen; i++){
    var elic=el.set('rel',i++);  //trying to set numeric ids for anchor els (from 0 to //max (ellen)
    }
    });
    chooseClass.addEvent('mouseenter', function(el) {
    infoGet(1,uniqueid); // function that sets the ajax request using unique id from loop
     }); 
});

Can anyone advise me how to do this?

Answer 1

This should do what you want if I understand the Question correctly

var offset = 0;
$$('.tdresult').each(function(chooseClass) {
 chooseClass.getElements('a').each(function(el){
      el.set('rel',offset); 
      el.addEvent('mouseenter', function(uniqueid) {
         return function() {
           infoGet(1,uniqueid); 
         }
      }(offset)); 
      offset++
 });

});

offset is incremented with the loop but is declared outside of it. Every time the loop runs, it will be the same offset variable being incremented. The loop that was there previously was not necessary.

One question though... why would you set the rel attribute to a number? see http://www.w3schools.com/TAGS/att_a_rel.asp for a list of valid values. Also note that none of the major browsers make use of this attribute anyways. (Epic fail on standards support for everyone)

EDIT

I noticed what you were trying to do with the event listener. I've modified the code to store the current offset in a closure with the event handler. The function in the event handler is immediately run with the current offset. Inside the function this is referred to as uniqueid. The function then returns the real event handler function but maintains use of the uniqueid variable (not offset, but the value of offset at the time the outer function was called).

Answer 2

I'm not 100% sure I understand what you're doing, but it looks like you are:

1. Finding every a element inside each .tdresult element
2. adding a unique value to the rel attribute to each
3. adding a mouseenter event to each which uses that rel attribute

If you want to store a unique value, try store and retrieve:

var unique_id = 0;
$$('.tdresult a').each(function(el){
 el.store('unique_id',unique_id);
 el.addEvent('mouseenter', function(evt) {
  infoGet(1,this.retrieve('unique_id')); 
 });     
 unique_id++;
});

Though it's possible I'm misunderstanding the task.

Answer 3

This is much easier in mootools cause each gives you a counter and as your in a closure at the each loop you doent need to store the id. Check out in mooShell (activate console)

$$('td a').each(function(el, uId){
        el.addEvent('mouseenter', function() {
               infoGet(1, uId);
        });     
});