Ajax / Javascript用户状态更新

Question

What I need to do is prepend the users latest status update with not only the newmsg and the users id but I need to also add my comment toggle link, my divider-postid div my users picture and name, my delete button, and my like and dislike button. So what I'd have is something like what Twitter and facebook do. ->Send the form data into ajax and print everything out into the feed. My profile.php has everything I use that needs to be included.

So is there a way I can call these blocks of html and display them in the prepended div after the Ajax success? Its really hard to explain as I don't know what I'm doing, but hopefully you get the idea. I'm just not up on all this.

PROFILE.PHP

   $(document).ready(function(){
    $("form#myform").submit(function(event) {
    event.preventDefault();
    var content = $("#toid").val();
    var newmsg = $("#newmsg").val();
    $.ajax({
    type: "POST",
    cache: false,
    url: "insert.php",
    data: "toid=" + content + "&newmsg=" + newmsg, 
    success: function(){
    $("#myThing").prepend("<div class='userinfo'>"+newmsg+" </div>");
    }
    });
    });
    });
    </script>
    <div class="userinfo"><div id="divider">
    <div class="form">
    <form id="myform"  method="POST"  class="form_statusinput">
    <input type="hidden"  name="toid" id="toid" value="<?php echo $user1_id; ?>">
    <input class="input" name="newmsg" id="newmsg" placeholder="Say something" autocomplete="off">
    <div id="button_block">
    <input type="submit" id="button" value="Feed">
    </div>
    </form>
    </div></div></div></body>
    <p id="myThing"></p>



  COMMENT LINK

echo "<div class='stream_option'><a style='cursor:pointer;' id='commenttoggle_".$streamitem_data['streamitem_id']."' onclick=\"toggle_comments('comment_holder_".$streamitem_data['streamitem_id']."');clearTimeout(streamloop);swapcommentlabel(this.id);\"> Write a comment...</a></div>";
}else{
echo "<div class='stream_option'><a style='cursor:pointer;' id='commenttoggle_".$streamitem_data['streamitem_id']."' onclick=\"toggle_comments('comment_holder_".$streamitem_data['streamitem_id']."');clearTimeout(streamloop);swapcommentlabel(this.id);\"> Show Comments (".$num2.")</a></div>";

LIKE LINK

cho "<div class='stream_option'><a id='likecontext_".$streamitem_data['streamitem_id']."' style='cursor:pointer;' onClick=\"likestatus(".$streamitem_data['streamitem_id'].",this.id);\">";

DISLIKE LINK

echo "<div class='stream_option'><a id='dislikecontext_".$streamitem_data['streamitem_id']."' style='cursor:pointer;' onClick=\"dislikestatus(".$streamitem_data['streamitem_id'].",this.id);\">";

DELETE LINK

<? if($streamitem_data['streamitem_creator']==$_SESSION['id']){
echo "<div style='cursor:pointer;position:relative;top:-70px;float:right;padding-right:5px;' onclick=\"delete_('".$streamitem_data['streamitem_id']."');\">X</div>";}   

Answer 1

I guess here:

success: function(){
  $("#myThing").prepend("<div class='userinfo'>"+newmsg+" </div>");
}

Is where you're inserting the HTML? If that's the case, and if insert.php returns HTML, try this:

success: function(r){
  $("#myThing").prepend("<div class='userinfo'>"+newmsg+r.responseText+" </div>");
}

---

To get the ID:
I guess the insertion is done with mysql, so after the new message is inserted you'd do:

$new_id = mysql_insert_id();

and then output the HTML:

echo "<div class='stream_option'><a id='likecontext_".$new_id."' style='cursor:pointer;' onClick=\"likestatus(".$new_id.",this.id);\">";

echo "<div class='stream_option'><a id='dislikecontext_".$new_id."' style='cursor:pointer;' onClick=\"dislikestatus(".$new_id.",this.id);\">";

if ($new_id == $_SESSION['id'])
  echo "<div style='cursor:pointer;position:relative;top:-70px;float:right;padding-right:5px;' onclick=\"delete_('".$new_id."');\">X</div>";