How can I make comments like on stackoverflow?

Question

How can I make comments like on stackoverflow?

What I mean more specificly, I use php/mysql how would I add a comment without reloading the page, I know this is a simple process of using AJAX but when you post a comment on SO it also has the option to delete it right away, when I insert comments into my DB there ID number is auto increment, so my real question now is

After posting the comment, is the comment posted, just added to the page with some javascript to append the contents to the page

OR

Does it use AJAX to retrieve that comment you just posted and then display it on the page?

The reason I am wondering is because since my system uses auto increment ID then if I did it the first method which would be faster to just ad the contents I posted on submit but this method would not give me the ID which is needed to be able to delete the comment by ID number

Hope that makes sense

UPDATE I posted below what I think now after reading other post on here

Answer 1

I'm going to go out on a limb and say it's right in between the two. The content of the comment is just posted from what you typed...

...but the page waits to append your comment until the AJAX magic has occurred and the page has the ID of your new comment.

(that should read: Here's how I would do it if I were you...fast, lightweight, and functional)

Answer 2

My guess is that after the page does an AJAX post to add the comment, it waits for a response from the server that gives it the id of the comment, then makes another AJAX call to render the comment based on the id returned. If you wanted to do it without retrieving the comment back from the server, you definitely could by just adding the comment via javascript. However things like user profile links might be a bit tedious to inject.

Edit: An easier method would be to have the first AJAX call return the HTML necessary to render the entire comment, then inject that response straight into the page. This would remove the need for 2 AJAX calls.

Answer 3

I would try something like this using jQuery:

function commentSubmit()
{
  $.post('/ajax/comment',{comment:$('#comment').val()},function(d){
    if(d is error) alert(d);
    else $('#allcomments').append(d);
  })
}

Where d can be error message or html with comment.

Answer 4

I would do an ajax request to a php script which would add the comment to the mysql database. The ajax callback would retrieve the ID and add the comment visually to the page (without a reload). The delete button would do another ajax request to a php script passing the ID to the script. The callback would remove the comment from the page.

Answer 5

If you want to be able to delete the comment, you must communicate with the server, so you must use ajax. Just send the comment to the server, wait for for the comments ID to be returned, then format the comment into some HTML, hide the new comment ID somewhere in the new HTML (probably in the link to delete the comment) and wala.