CODEWITHSUNDEEP
phpajaxcomments
JasonDavis
JasonDavis

Reputation: 48953

How can I make comments like on stackoverflow?

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

Upvotes: 3

Views: 658

Answers (6)

JasonDavis
JasonDavis

Reputation: 48953

UPDATE

After reading answers here is my basic idea, I don't know how to write javascrpt but you will get the design flow idea:

POST comment input to script with AJAX {    
    if commentID is returned{
        Insert comment DIV into page, userID and userPicture are in a user session variable and commentID is returned from ajax post
    }ELSE IF error is returned{
        Insert an error message DIV into page
    }
}

Then the comment div or whatever that is inserted would include
- a users name from session variable
- userID from session variable for linking to there profile
- user picture from session variable
- comment ID for allowing the user to delete that comment

Then for deleting ANY comment on the page that a user published

POST comment ID and userID to DELETION script with AJAX {    
    if commentID is deleted{
        REMOVE comment DIV from page
    }ELSE IF error is returned{
        Insert an error message DIV into page
    }
}

Upvotes: 0

Kevin Pang
Kevin Pang

Reputation: 41442

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.

Upvotes: 2

SquareRootOf2
SquareRootOf2

Reputation: 393

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.

Upvotes: 0

DLH
DLH

Reputation: 2821

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.

Upvotes: 0

Thinker
Thinker

Reputation: 14464

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.

Upvotes: 1

Justin Niessner
Justin Niessner

Reputation: 245429

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)

Upvotes: 5

Related Questions