My Ajax Call is Not Working Inside Loop But Is Working On Individual Post

i have an issue with my wordpress website where i am able to post comments using ajax for individual post but i am unable to do it when i am looping comments
what can be the issue ? Kindly help

This is the code for my comments file

when i am calling comments in a wordpress loop , on submitting the comment the whole page gets reloaded and then comment is posted. But in individual post it is taken as ajax

Please help in this regard

<div class="row">
<div style="text-align:center;margin:4px 0 0 0;">
<h2 algin="center;" style="line-height:0.9em;"> Comments </h2>
<?php if (!empty($post->post_password) && $_COOKIE['wp-postpass_'.COOKIEHASH]!=$post->post_password) : ?> 
<p id="comments-locked">Enter your password to view comments.</p> 
<?php return; endif; ?> 
<?php if (pings_open()) : ?> 
<?php endif; ?> 
<?php  
$author = array( 
"highlight" => "highlight", 
"email" => "YOUR EMAIL HERE", 
"name" => "YOUR NAME HERE" 
);  
$numPingBacks = 0; 
$numComments  = 0; 
foreach ($comments as $comment) { 
if (get_comment_type() != "comment") { $numPingBacks++; } 
else { $numComments++; } 
} 
$thiscomment = 'odd';  
?> 
<?php if ($comments) : ?> 
<?php 
if ($numPingBacks != 0) : ?> 
<h2 class="comments-header"><?php _e($numPingBacks); ?>     Trackbacks/Pingbacks</h2> 
<div id="trackbacks"> 
<?php foreach ($comments as $comment) : ?> 
<?php if (get_comment_type()!="comment") : ?> 
<div id="comment-<?php comment_ID() ?>" class="<?php _e($thiscomment); ?>"> 
<?php comment_type(__('Comment'), __('Trackback'), __('Pingback')); ?>:  
<?php comment_author_link(); ?> on <?php comment_date(); ?> 
</div>  
<?php if('odd'==$thiscomment) { $thiscomment = 'even'; } else { $thiscomment = 'odd'; } ?>      
<?php endif; endforeach; ?> 
</div> 
<?php endif; ?> 
<?php  
if ($numComments != 0) : ?>  
<div id="comments" style="color:#000000;font-weight:900;font-size:1em;">     
<?php foreach ($comments as $comment) : ?> 
<?php if (get_comment_type()=="comment") : ?> 
<div class="col-lg-12 col-md-12 col-sm-12">
<div id="comment-<?php comment_ID(); ?>" class="<?php  
$this_name = $comment->comment_author; 
$this_email = $comment->comment_author_email; 
if (strcasecmp($this_name, $author["name"])==0 && strcasecmp($this_email, $author["email"])==0) 
_e($author["highlight"]);  
else  
_e($thiscomment);  
?>"> 
<div class="col-lg-1 col-md-1 col-sm-1">  
</div> 
<div align="left" class="col-lg-2 col-md-2 col-sm-2 comment-meta"> 
<?php echo get_avatar($comment, 50 );?>
<span class="comment-author"><br/><?php comment_author_link() ?><br/></span> 
<span class="comment-date"><?php comment_date() ?></span> 
</div> 
<div align="left" class="col-lg-8 col-md-8 col-sm-8 comment-text">  
<?php comment_text(); ?> 
</div> 
<div class="col-lg-1 col-md-1 col-sm-1">  
</div> 
</div>
<div class="col-lg-12 col-md-12 col-sm-12">
<div class="col-lg-1 col-md-1 col-sm-1"></div>
<div class="col-lg-10 col-md-10 col-sm-10" style="border-top:1px solid #BDBDBD;padding:0.25em 0 0.25em 0;"></div>
<div class="col-lg-1 col-md-1 col-sm-1"></div>
</div>
</div>
<?php if('odd'==$thiscomment) { $thiscomment = 'even'; } else { $thiscomment = 'odd'; } ?> 
<?php endif; endforeach; ?> 
</div>
<div class="col-lg-12 col-md-12 col-sm-12 commentlist"></div>
<?php endif; ?> 
<?php else : ?> 
<div class="col-lg-12 col-md-12 col-sm-12 commentlist"></div> 
<?php endif; ?> 
<?php if (comments_open()) : ?>
<div id="comments-form"> 
<div id="comments-header" style="font-size:1.3em;font-weight:900;color:#4a235a;">Leave a comment below</div>  
<?php if (get_option('comment_registration') && !$user_ID ) : ?> 
<p id="comments-blocked">You must be LOGGED IN to post a comment.</p> 
<?php else : ?> 
<form action="<?php echo get_option('siteurl'); ?>/wp-comments-post.php" method="post" id="commentform"> 
<?php if ($user_ID) : ?> 
<?php else : ?> 
<p><label for="author">Name<?php if ($req) _e(' (required)'); ?></label><br>
<input type="text" name="author" id="author" value="<?php echo $comment_author; ?>" size="22" /></p>
<p><label for="email">E-mail (will not be published)<?php if ($req) _e(' (required)'); ?></label><br>
<input type="text" name="email" id="email" value="<?php echo $comment_author_email; ?>" size="22" /></p> 
<?php endif; ?> 
<p><textarea name="comment" id="comment" style="width:80%;height:120px;color:#000000;"></textarea></p>
<p><button type="submit" name="submit" id="sub">Submit</button> 
<input type="hidden" name="comment_post_ID" value="<?php echo $id; ?>"</p>
<?php do_action('comment_form', $post->ID); ?> 
</form> 
</div> 
<?php endif; ?> 
<?php else : ?> 
<p id="comments-closed">Sorry, comments for this entry are closed at this time.</p> 
<?php endif; ?>
</div>
</div>

<script>
jQuery('document').ready(function($){
var commentform=$('#commentform'); // find the comment form
commentform.prepend('<div id="comment-status" ></div>'); // add info panel before the form to provide feedback or errors
var statusdiv=$('#comment-status'); // define the info panel
var list ;
$('a.comment-reply-link').click(function(){
list = $(this).parent().parent().parent().attr('id');
});

commentform.submit(function(){
//serialize and store form data in a variable
var formdata=commentform.serialize();
//Add a status message
statusdiv.html('<p style="color:#000000;font-weight:900;">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" style="color:#FF0000;font-weight:900;">Error : Either You Are Trying To Post The Same Comment Again Or Spamming</p>');
},
success: function(data, textStatus){
if(data == "success" || textStatus == "success"){
statusdiv.html('<p class="ajax-success" style="color:#66FF33;font-weight:900;">Thanks for your comment. We appreciate your response.</p>');
//alert(data);
$('#comment').val('');
if($("#row").has("div.commentlist").length > 0){
if(list != null){
$('div.rounded').prepend(data);
}
else{
$('div.commentlist').append(data);
}
}
else{
$('div.commentlist').append(data);
}
}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>

Read more here: My Ajax Call is Not Working Inside Loop But Is Working On Individual Post

Leave a Reply

Your email address will not be published. Required fields are marked *