Blog post comment without page refresh (ajax)

Question

I'm trying to make comments on my page just like the ones in wordpress. When you press post comments your page updates without reload. How can I do that?

I understand I have to use jquery post, and I've had several attempts but for some reason my web page keeps reloading. I have a form like this :

<form name="postForm" id="postForm" action="addComments.php" method="post">
<textarea name="commentContent"></textarea>
<input type="submit" name="commentButton" id="commentButton">
</form>

I tried $("#commentButton").click(function() do something .. but I still get the page reload. I mean I have the php part ready, working with page reload like an ordinary form just fine, just I'd like to learn and do this without page reload. Any idea how can I make this happen?

Answer 1

try using http://www.malsup.com/jquery/form/ . It is jQuery plugin to submit form without page load... hope it will help you..

Answer 2

There is a great tutorial I found while i was searching something similar like adding, deleting comments without page refresh.

http://www.9lessons.info/2009/11/insert-delete-with-jquery-and-ajax.html

Answer 3

You must return false from the click handler function to prevent default browser action – which is, submit the form. So your handler might look something like this:

$("#commentButton").click(function() {
    ...do your stuff...
    return false;
});

Or you can bind to the submit event also:

$("#postForm").submit(function() {
    ...do your stuff...
    return false;
});

Answer 4

$（'＃postForm'）。submit（function（）...