jeudi 23 juin 2016

jQuery, ajax: Update inbox after submitting a reply (edit)

There could be some duplicates about this question, but I didn't quite find the answer that I needed. So the question is about updating the inbox after the user sends a reply, just like on Facebook. My messaging structure looks like these: <div class="message_container"> <div class="message_inbox"> <div class="inbox"> <?php include("./includes/messages/inbox.php"); ?> </div> </div> <div class="message_conversation"> <div class="conversation"> <ul> <li> <div> <span>Profile name</span> <span>conversation</span> </div> </li> <li> <div> <span>Profile name</span> <span>conversation2</span> </div> </li> <li> <div> <span>Profile name</span> <span>conversation3</span> </div> </li> </ul> </div> <textarea id="reply"></textarea> </div> </div> I separate the inbox into a separate file and use the include(); function to display the file. Here's the basic content of the inbox.php file: <ul> <li> <div> <span>Profile name</span> <span>message</span> </div> </li> <li> <div> <span>Profile name2</span> <span>message</span> </div> </li> <li> <div> <span>Profile name3</span> <span>message</span> </div> </li> </ul> So, after the user sends a reply, I managed to update the page by appending the data, so no problem there. The only thing that I want to know is how to update or refresh the inbox after the user sends a reply (without refreshing the page). Edit: Here is my ajax code for submitting a reply: $(function() { $("#reply").keypress(function(e) { if (e.which == 13 && !e.shiftKey) { var reply = $(this).val(); var toid = <?php echo json_encode($_GET['id']); ?>; $.ajax({ method: "GET", url: "./ajax/reply_conversation.php", data: {reply: reply, toid: toid}, cache: false, success: function(html) { $(".conversation ul").append(html); $("#reply").val(''); } }) } }) }) The reply_conversation.php file returns a <li></li>, the same structure on the inbox.php that contains the username and the latest message.

Aucun commentaire:

Enregistrer un commentaire