Delete MySQL data with php through ajax and jquery, show page without deleted data

Question

I have this link (shown below). When it is clicked it sends the id of a post to a PHP file called delete_post.php which in turn deletes the post with that id out of my MySQL database. This works great except that after the post is deleted the post is still displayed on the page until it is refreshed. How could I make it so the post is removed from my page as soon as I click the link, rather than after I click the link and after I refresh the page.

<a href="javascript:$.post('delete_post.php', { id: '$row[id]' } );" class='delete_post' title='delete post'>delete post</a>

Answer 1

1. Add an ID (using the $row['id']) to the div / table row (the container) that is holding your post.
2. After the AJAX is completed, you then simply hide the container.

To hide the container after your AJAX is complete, simply modify your $.post by adding a callback function like this:

javascript:$.post('delete_post.php', { id: '$row[id]' } , function(){ $('#row$row[id]').hide(); });