Question

Right, I solved my previous problem of not being able to submit the textarea on the return key but that presented a new one. It submits the comment via ajax, and then loads it fine, on the first status. No matter which post I try and add the comment to, it appends the comment to the first status div on the page, not the one which the action is being carried out on. However, if I refresh the page, the comments appear on the right status, so I know the right ID’s are being submitted, it’s just being appended in the wrong place, but I can’t see why.

My submit code:

$(function() {  
    $('textarea#scat').bind('keydown', function(e) {
        if(e.keyCode==13){
            var myClass = $(this).attr("class");  
            var comment = $("textarea." + myClass).val();  
            if (comment == "") {  
                return false;  
            }

            if (!$.trim($("textarea." + myClass).val())) {  
                return false;  
            }

            var cid = $("input.c_" + myClass).val();  
            var itemid = $("input.i_" + myClass).val();  
            var type = $("input.t_" + myClass).val();  
            var top = $("input.l_" + myClass).val();  

            var dataString = 'comment='+ comment + '&cid=' + cid + '&itemid=' + itemid + '&type=' + type;  

            $.ajax({  
                type: "POST",  
                url: "addcomment.php",  
                data: dataString,  
                success: function() {  
                    $('#c').load('ajax/querylc.php?oid=' + myClass); 
                    $("textarea." + myClass).val('');
                }  
            });  
        return false;  
        }
    });  
});  

My ajax/querylc.php (which loads the comment and appends it to said status)

$onuid = strip_tags(stripslashes(htmlentities(mysql_real_escape_string($_GET['oid']))));

  $re = ("SELECT * FROM (SELECT comment as comment, byuid as byuid, comuid as comuid, likes as likes, dislikes as dislikes, UNIX_TIMESTAMP(timestamp) as timestamp FROM mingle_comments WHERE onuid = '$onuid' AND type = 'status' ORDER BY timestamp DESC LIMIT 2) mingle_comments ORDER BY timestamp ASC") ; //query
   $result = mysql_query($re)  or die (mysql_error());
  if(mysql_num_rows($result) >= 2) {
        ?>
        <div id="sa" style="background:#E0E0E0; padding:5px 5px 5px 5px;">
            <a href="#" style="font-family:Arial; font-size:12px; color:#3a3a3a; text-decoration:none;">View all comments...</a>
        </div>
        <?php
    }

  while($st = mysql_fetch_assoc($result)) {
    $comment = $st['comment'];
    $by = $st['byuid'];
    $comuid = $st['comuid'];
    $time = $st['timestamp'];
    $l = $st['likes'];
    $d = $st['dislikes'];

    $bq = "SELECT * FROM users WHERE uid = '$by' LIMIT 1";
    $bqq = mysql_query($bq) or die (mysql_error());

    while($bqr = mysql_fetch_assoc($bqq)) {
        $dp = $bqr['dp'];
        $fbq = $bqr['fname'];
        $sbq = $bqr['sname'];
    }
    ?>

    <div id="commentbox" class="<?php echo $comuid; ?>" style="padding:5px 5px 5px 5px;">
        <div id="cbi" style=" display:inline; position:relative; ">
            <img src="<?php if ($dp == null) { echo 'img/unknown_user.jpg'; } else { echo "pf/" . $by . "/" . $dp; } ?>" width="36px" style=" display:inline; position:relative;"/>
        </div>
        <div id="cbt" style="position:relative; margin-left:32px; margin-top:-35px;">
            <a href="profile.php?uid=<?php echo $uid; ?>" style="position:relative; font-size:13px; margin-left:10px; font-family:Arial; color:#3a3a3a; text-decoration:none;"><?php echo $fbq . " " . $sbq; ?></a>
            <p class="<?php echo $comuid; ?>" style="position:relative; margin-left:5px;"><?php echo $comment; ?></p>
        </div>
        <div id="clb" style="background:#E0E0E0; padding-left:5px;">
            <a href="#">Like</a> <a href="#">Dislike</a> <a href="#" id="time"><?php echo time_since($time); ?></a>
        </div>
    </div>

<?php
}
?>

Any ideas why this is happening? :/ Also, if I hold the return key down it submits it multiple times, any ideas how I could prevent that?

Answer 1

Also, if I hold the return key down it submits it multiple times, any
ideas how I could prevent that?

Use keypress event instead of keydown

$('#c').load('ajax/querylc.php?oid=' + myClass); 

‘#c’ selector selects the first element with id “c”. So try to generate this id as unique one (“#c1”, “#c2”, etc).