Ajax submit comments

Question

I want to submit comments via ajax. CLick the comment submit button, comments gets posted via jquery's ajax method and the result ("Awaiting moderation...") is displayed on the page.

I went into the scripts.js file and added a click handler for the button. It validates and then does an ajax submit but this is not working. Clicking to submit a comment still redirects to the wp-comments-post.php page.

What's the secret to getting this to work?

Here is what I have in scripts.js:

$("#my_comment_form").validate({
        submitHandler: function(data){
            $.ajax({
                type: "POST",
                url: "../wp-comments-post.php",
                data: data,
                success: function(){
                    $( ".form_success" ).dialog( "open" );
                },
                error: function(){
                    console.log('oh snap!');
                },
                complete: function(){
                    console.log('complete');
                }
            });
        },
       errorContainer: ".errors",
       rules: {
         email: {
           email: true
         }
       }
    });

---

EDIT: My problem stemmed from the fact that the data being passed back was not complete or had errors. This caused the submitHandler to error which then let the built-in action (built into Wordpress' comment generation code) fire. By passing in correct data in the first place and handling any errors that may arise in the submitHandler's error method I was able to get things working with the above code.

Answer 1

you might find these links handy if you're going to code it yourself

http://byronyasgur.wordpress.com/2011/06/27/frontend-forward-facing-ajax-in-wordpress/ http://www.garyc40.com/2010/03/5-tips-for-using-ajax-in-wordpress/

I am fairly sure your URL is wrong url: "../wp-comments-post.php" - ajax in wordpress has to be sent (quite strangely) to/through admin-ajax.php (even if it's not on the admin side). If you read the first link it is explained in a fair bit of detail. It's a slightly odd a route to send the data on but that's how it's done it seems ( despite some new developments mentioned in the comments of both posts)

Answer 2

You can use some plugins to get the AJAX work

Ajax Comment Posting

WordPress Ajax Comments Inline

AJAX Comments

Just a suggestion only if you don't want to code.

Answer 3

Try my solution for Ajax comment submit https://gist.github.com/OzzyCzech/5038455 working on Wordpress 3+