Question

Hi all got a small problem accessing a looped php variable. My script loops through and uses x and y from a mysql database. It also loops the id out which I cannot get access to, it comes up as undefined. I am using a mouse out function to detect each separate div that has been looped and get specific id.

Help very much appreciated!

Javascript to get attributes ready for database manipulation:

  $(this).mouseout(function() {

   var stickytext_id = $(this).attr('textstickyid');//alerted out returns undefined.

   });

Looped PHP to get attr form:

      $get_textsticky_result=mysql_query($get_textsticky_query);

      while($row=mysql_fetch_assoc($get_textsticky_result)){
        $x = $row['textsticky_x'];
        $y = $row['textsticky_y'];

 echo '<div class="textsticky" style="position: absolute; left:'.$x.'px; top:'.$y.'px;" textstickyid="'.$row['textsticky_id'].'">
    <div class="textstickyvalueholder"contentEditable="true">'. $row['textsticky_text'] .'  
     </div><button>Like</button></div>';

      }
      ?>

Can get other looped vars e.g. $row[‘textsticky_text’]; and x and y for position without issue, Is there a better way to do this? I have a feeling the inline style is affecting it but not sure….

Answer 1

Okay, I am just going to go out on a limb here and assume your initial selector is incorrect. $(this) is the window in typical code flow.

$(this).mouseout(function() {
    var stickytext_id = $(this).attr('textstickyid');//alerted out returns undefined.
});

Should be:

$('div.textsticky').mouseout(function() {
    var stickytext_id = $(this).attr('textstickyid');//alerted out returns undefined.
});

Also, as Kris mentioned in comments, instead of inventing tags use the data attribute which is a part of html5.

<div class="textsticky" data-textstickyid="blah" />

It can then be accessed via jQuery’s data method.

http://jsfiddle.net/kQeaf/

And as long as we are offering advice, if you are in jQuery 1.7+ you should be using prop instead of attr for accessing properties (unless of course you decide to use the data method) just recommended.