I have an issue I cannot solve. On my single.php page I included the comment form:
<?php comments_template('/partials/comments.php'); ?>
In my partials folder I made a comments.php (from the theme where this is working fine):
<?php
/**
* The template for displaying Comments.
*
* The area of the page that contains both current comments
* and the comment form. The actual display of comments is
* handled by a callback to MYtheme_comment().
*
*/
function MYtheme_comment( $comment, $args, $depth ) {
$GLOBALS['comment'] = $comment;
switch ( $comment->comment_type ) :
case 'pingback' :
case 'trackback' :
?>
<li class="post pingback">
<p><?php esc_html_e( 'Pingback:', 'my_theme' ); ?> <?php comment_author_link(); ?><?php edit_comment_link( esc_html__( 'Edit', 'my_theme' ), '<span class="edit-link">', '</span>' ); ?></p>
<?php
break;
default :
?>
<li <?php comment_class('clearfix'); ?> id="comment-<?php comment_ID(); ?>">
<span class="comment_avatar">
<?php
$avatar_size = 100;
if ( '0' != $comment->comment_parent ){
$avatar_size = 100;
}
echo get_avatar( $comment, $avatar_size );
echo '</span><span class="comment_content">';
?>
<div class="comment-text">
<?php
/* translators: 1: comment author, 2: date and time */
printf( esc_html__( '%1$s %2$s', 'my_theme' ),
sprintf( '<span class="comment-author">%s</span>', get_comment_author_link() ),
sprintf( '<time pubdate datetime="%2$s">%3$s</time>',
esc_url( get_comment_link( $comment->comment_ID ) ),
get_comment_time( 'c' ),
/* translators: 1: date, 2: time */
sprintf( esc_html__( '%1$s at %2$s', 'my_theme' ), get_comment_date(), get_comment_time() )
)
);
?>
<?php edit_comment_link( esc_html__( 'Edit', 'my_theme' ), '<span class="edit-link">', '</span>' ); ?>
<?php if ( $comment->comment_approved == '0' ) : ?>
<em class="comment-awaiting-moderation"><?php esc_html_e( 'Your comment is awaiting moderation.', 'my_theme' ); ?></em>
<br />
<?php else: ?>
<?php comment_text(); ?>
<?php endif; ?>
<p class="reply">
<?php comment_reply_link( array_merge( $args, array( 'reply_text' => esc_html__( 'Reply ', 'my_theme' ).'<i class="ci_icon-chevronright-thin"></i>', 'depth' => $depth, 'max_depth' => $args['max_depth'] ) ) ); ?>
</p><!-- .reply -->
</span>
</div>
<?php
break;
endswitch;
}
?>
<div id="comments">
<?php if ( post_password_required() ) : ?>
<p class="nopassword"><?php esc_html_e( 'This post is password protected. Enter the password to view any comments.', 'my_theme' ); ?></p>
</div><!-- #comments -->
<?php
/* Stop the rest of comments.php from being processed,
* but don't kill the script entirely -- we still have
* to fully load the template.
*/
return;
endif;
?>
<?php // You can start editing here -- including this comment! ?>
<?php if ( have_comments() ) : ?>
<h3 id="comments-title"><?php printf( _n( 'One comment', '%1$s comments', get_comments_number(), 'my_theme' ), number_format_i18n( get_comments_number() ) );?></h3>
<?php if ( get_comment_pages_count() > 1 && get_option( 'page_comments' ) ) : // are there comments to navigate through ?>
<nav id="comment-nav-above">
<h1 class="assistive-text"><?php esc_html_e( 'Comment navigation', 'my_theme' ); ?></h1>
<div class="nav-previous"><?php previous_comments_link( esc_html__( '← Older Comments', 'my_theme' ) ); ?></div>
<div class="nav-next"><?php next_comments_link( esc_html__( 'Newer Comments →', 'my_theme' ) ); ?></div>
</nav>
<?php endif; // check for comment navigation ?>
<ol class="commentlist">
<?php
/* Loop through and list the comments. Tell wp_list_comments()
* to use MYtheme_comment() to format the comments.
* If you want to overload this in a child theme then you can
* define MYtheme_comment() and that will be used instead.
* See MYtheme_comment() in twentyeleven/functions.php for more.
*/
wp_list_comments( array( 'callback' => 'MYtheme_comment' ) );
?>
</ol>
<?php if ( get_comment_pages_count() > 1 && get_option( 'page_comments' ) ) : // are there comments to navigate through ?>
<nav id="comment-nav-below">
<h1 class="assistive-text"><?php esc_html_e( 'Comment navigation', 'my_theme' ); ?></h1>
<div class="nav-previous"><?php previous_comments_link( esc_html__( '← Older Comments', 'my_theme' ) ); ?></div>
<div class="nav-next"><?php next_comments_link( esc_html__( 'Newer Comments →', 'my_theme' ) ); ?></div>
</nav>
<?php endif; // check for comment navigation ?>
<?php
/* If there are no comments and comments are closed, let's leave a little note, shall we?
* But we don't want the note on pages or post types that do not support comments.
*/
elseif ( ! comments_open() && ! is_page() && post_type_supports( get_post_type(), 'comments' ) ) :
?>
<p class="nocomments"><?php esc_html_e( 'Comments are closed.', 'my_theme' ); ?></p>
<?php endif; ?>
<?php
$commenter = wp_get_current_commenter();
$req = get_option( 'require_name_email' );
$aria_req = ( $req ? " aria-required='true'" : '' );
$fields = array(
'author' =>
'<div class="comment_fields"><p class="comment-form-author"><input id="author" name="author" type="text" placeholder="' . esc_html__( 'Name*', 'my_theme' ) . '" value="' . esc_attr( $commenter['comment_author'] ) .
'" size="30"' . $aria_req . ' /></p>',
'email' =>
'<p class="comment-form-email"><input id="email" name="email" type="text" placeholder="' . esc_html__( 'E-mail*', 'my_theme' ) . '" value="' . esc_attr( $commenter['comment_author_email'] ) .
'" size="30"' . $aria_req . ' /></p>',
'url' =>
'<p class="comment-form-url"><input id="url" name="url" type="text" placeholder="' . esc_html__( 'Website*', 'my_theme' ) . '" value="' . esc_attr( $commenter['comment_author_url'] ) .
'" size="30"' . $aria_req . ' /></p></div>',
);
$comment_field = '<p class="comment-form-comment"><textarea id="comment" name="comment" placeholder="' . esc_html__( 'Message*', 'my_theme' ) . '" cols="45" rows="8" aria-required="true"></textarea></p>';
comment_form(array(
'fields' => $fields,
'comment_field' => $comment_field,
'comment_notes_after' => '',
'id_submit' => 'comment-submit',
'title_reply' => esc_html__( 'Leave a reply', 'my_theme' ),
'label_submit' => esc_html__( 'Leave a comment', 'my_theme' ),
)); ?>
<div class="clear"></div>
</div><!-- #comments -->
The form appears, my comments are enabled in the wordpress. I fill the form and click on the submit button, and nothing happens!
So I tried to ajaxify it by adding the code from here
<script type="text/javascript">
jQuery('document').ready(function($){
// Get the comment form
var commentform = $('#commentform');
// Add a Comment Status message
commentform.prepend('<div id="comment-status" ></div>');
// Defining the Status message element
var statusdiv = $('#comment-status');
commentform.submit(function(){
// Serialize and store form data
var formdata = commentform.serialize();
//Add a status message
statusdiv.html('<p class="ajax-placeholder">Processing...</p>');
//Extract action URL from commentform
var formurl = commentform.attr('action');
//Post Form with data
$.ajax({
type: 'post',
url: formurl,
data: formdata,
error: function(XMLHttpRequest, textStatus, errorThrown){
statusdiv.html('<p class="ajax-error" >You might have left one of the fields blank, or be posting too quickly</p>');
},
success: function(data, textStatus){
if(data == "success")
statusdiv.html('<p class="ajax-success" >Thanks for your comment. We appreciate your response.</p>');
else
statusdiv.html('<p class="ajax-error" >Please wait a while before posting your next comment</p>');
commentform.find('textarea[name=comment]').val('');
}
});
return false;
});
});
</script>
Now when I comment, I get first the first error about leaving one of the fields blank, and then after that immediately I get the second error about posting a comment too quickly. I also noticed a 409 (Conflict) error in the console in Chrome that comes from mythemefolder/wp-comments-post.php which is a default from action link that comes from wordpress.
The strange thing is that once I refresh my page, I can see the post that I've added with ajax post. If I remove ajax and try to post a comment, and then refresh, nothing happens.
So what can be the issue? Why is there nothing being posted when I have no AJAX, and why are comments appearing when I have AJAX but only on page refresh?
EDIT
In Firebug when I inspect and send the form, I get:
POST mythemefolder/wp-comments-post.php 302 Moved Temporarily 2,51s
POST mythemefolder/wp-comments-post.php 409 Conflict 1,37s
GET mythemefolder/postname/#comment-11 200 OK 2,64s
So something happens. When I open the conflict one I find
<p>Duplicate comment detected; it looks as though you’ve already said that!</p></body>
Any clues?
