simpletip help with dynamic content loading

Question

I am trying to load content from the database using simpletip. My code:

<script type="text/javascript">

    $(document).ready(function(){
        $('a.regularsList').simpletip({
            onBeforeShow: function(){
                this.load('/regulars/tooltip', {id: $(this).attr("id")});
            }
        });
    })

I get that id is undefined. I don't understand what am i doing wrong since i am trying to access the value of the id attribute.

Answer 1

In your current code this refers to document, instead use .each() loop here so that this refers to the anchor you want, like this:

$(function(){ //short for $(document).ready(function(){
  $('a.regularsList').each(function() {
     var a = this;
     $(this).simpletip({
        onBeforeShow: function(){
          this.load('/regulars/tooltip', { id: a.id });
        }
    });
});

Inside the .each() loop, this refers to the current a.regularsList element you're looking over, so you can just use this.id to get the id property.