Log In

Email:
Password:
Keep me logged in

Forgot Password

Email:




Social Media
     
CategoriesCSS (5)
jQuery (73)
PHP (30)
.htaccess (4)
Sponsored Links


Post/Delete Comment System
PHP Ajax Javascript jQuery CSS
Demo | Browse Category | Friday, February 10, 2012 by




MySQL:
Create tables for the comments and the content being commented.
CREATE TABLE `content` (
`id` INT NOT NULL ,
`content` VARCHAR( 50 ) NOT NULL
) ENGINE = MYISAM ;
CREATE TABLE `comments` (
`comment_id` INT NOT NULL AUTO_INCREMENT PRIMARY KEY ,
`id` INT NOT NULL ,
`ip` VARCHAR( 50 ) NOT NULL ,
`username` VARCHAR( 50 ) NOT NULL ,
`comment` TEXT NOT NULL ,
`date_time` VARCHAR( 100 ) NOT NULL
) ENGINE = MYISAM ;
jQuery:
<?php

$id 
$_GET['id'];

?>
<html>
<head>
<script src="http://code.jquery.com/jquery-latest.js"></script>
<script>
$(function(){
$("#submit").click(function(){
var u = $('#u').val();
var c = $('#c').val();
var data = 'u='+u+'&c='+c+'&id=<?php echo $id; ?>';

$.ajax({
type: 'POST',
url: 'post-comment.php',
data: data,
success: function(e){
if(e){
if(!$('#error').is(':visible')){
$("#error").html(e).fadeIn(500).delay(2000).fadeOut(500);
}
} else {
if(!$('#posted').is(':visible')){
$("#posted").html("Comment posted").fadeIn(500).delay(2000).fadeOut(500);
}
$.get('ajax-comments.php?id=<?php echo $id; ?>', function(d){
$("#comment_posts").html(d);
});
$('#u, #c').val('');
}
}
});
});

$(".page").live("click", function(){
var id = $(this).attr("id");
$.get('ajax-comments.php?page='+id, function(d){
$("#comment_posts").html(d);
});
});
$('.comments').live("mouseover", function(){
var id = $(this).attr("id").substr(1);
$("#d"+id).show();
}).live("mouseout", function(){
var id = $(this).attr("id").substr(1);
$("#d"+id).hide();
});
$('.trash').live("click", function(){
var id = $(this).attr("id").substr(1);
var data = 'comment_id='+id;

$.ajax({
type: 'POST',
url: 'delete-comment.php',
data: data,
success: function(e){
if(e){
$("#error").html(e).fadeIn(500).delay(2000).fadeOut(500);
} else {
if(!$('#posted').is(':visible')){
$("#posted").html("Comment deleted").fadeIn(500).delay(2000).fadeOut(500);
}
$.get('ajax-comments.php', function(d){
$("#comment_posts").html(d);
});
}
}
});
});
});
</script>
<style>
#error {
color: #ed3232; display: none; font-size: 14px;
} #posted {
color: #32baed; display: none; font-size: 14px;
} table.comments {
border-left: 1px #ef89ff solid; border-right: 1px #ef89ff solid; border-bottom: 1px #ef89ff solid; position: relative; width: 300px;
} table.comments:first-child {
border-top: 1px #ef89ff solid;
} .page:hover {
cursor: pointer; text-decoration: underline;
} .trash {
display: none; position: absolute; right: 3px; bottom: 15px; width: 15px;
} .p {
background: #32baed;
} #tip {
height: 1px; left: 6px; position: absolute; top: -1px; width: 3px;
} #top {
height: 2px; width: 15px;
} #p1 {
height: 8px; left: 3px; position: absolute; -webkit-transform: rotate(355deg); top: 2px; width: 1px;
} #p2 {
height: 8px; left: 7px; position: absolute; top: 2px; width: 1px;
} #p3 {
height: 8px; right: 3px; position: absolute; -webkit-transform: rotate(5deg); top: 2px; width: 1px;
} #bottom {
top: 10px; height: 2px; left: 3px; position: absolute; width: 9px;
}
</style>
</head>
<body>
<input id="u" placeholder="Name..."><br>
<textarea id="c" placeholder="Comment..."></textarea><br>
<input id="submit" type="button" value="Comment"><br>
<span id="error"></span>
<span id="posted"></span><br><br>
<div id="comment_posts">
<?php

include 'ajax-comments.php';

?>
</div>
</body>
</html>
ajax-comments.php, file with the list of comments
<?php

$connect 
mysql_connect("server""username""password");
$db mysql_select_db("your_database"$connect);
$id $_GET['id'];
$ip $_SERVER['REMOTE_ADDR'];

$page 1;
if(
$_GET['page']){
    
$page $_GET['page'];
}

$rrp 5;
$o = ($page-1)*$rrp;

$q mysql_query("SELECT * FROM comments ORDER BY comment_id DESC LIMIT $o, $rrp");

while(
$r=mysql_fetch_array($q)){
    
$c eregi_replace('\r\n''<br>'$r['comment']);
    
$u $r['username'];
    
$date $r['dateposted'];
    
    if(
$r['ip']==$ip){
        
$delete '<div class="trash" id="d'.$r['comment_id'].'">
        <div class="p" id="top"></div>
        <div class="p" id="tip"></div>
        <div class="p" id="p1"></div>
        <div class="p" id="p2"></div>
        <div class="p" id="p3"></div>
        <div class="p" id="bottom"></div>
        </div>'
;
    }
    
    
$comment .= '<table class="comments" id="t'.$r['comment_id'].'"><tr><td><b>'.$u.'</b><br>'.$c.'<br><br><span style="color:#32baed; font-size:12px">'.$date.'</span>'.$delete.'</td></tr></table>';
}

echo 
$comment;

$q mysql_query("SELECT * FROM comments WHERE id='$id'");
$n mysql_num_rows($q);
$pages ceil($n/$rrp);
$range 4;

if(
$pages>1){
    if(
$page>1){
        
$first '<a class="page" id="1">First</a> ';
        
$prev '<a class="page" id="'.($page-1).'">Prev</a> ';
    }
    if(
$page<$pages){
        
$next '<a class="page" id="'.($page+1).'">Next</a> ';
        
$last '<a class="page" id="'.$pages.'">Last</a> ';
    }
    
    for(
$p=($page-$range); $p<=($page+$range); $p++){
        if(
$p>=1&&$p<=$pages){
            if(
$p==$page){
                
$nav .= '<span style="color: #32baed">'.$p.'</span> ';
            } else {
                
$nav .= '<a class="page" id="'.$p.'">'.$p.'</a> ';
            }
        }
    }
}

echo 
$first $prev $nav $next $last;

?>
post-comment.php, ajax file where comment posts would be processed
<?php

$connect 
mysql_connect("server""username""password");
$db mysql_select_db("your_database"$connect);

$ip $_SERVER['REMOTE_ADDR'];
$id $_POST['id'];
$username $_POST['u'];
$comment $_POST['c'];
$dateposted date("D, M d, Y") .' at '.date("h:i A");
$sc substr_count($comment" ");
$su substr_count($username" ");

if(
$sc<strlen($comment)){
    if(
$su<strlen($username)){
        
mysql_query("INSERT INTO comments VALUES('','$id','$ip','$username','$comment','$dateposted')");
    } else {
        echo 
'Please enter a name';
    }
} else {
    echo 
'Comment cannot be blank';
}

?>
delete-comment.php, ajax file where comments would be deleted
<?php

$connect 
mysql_connect("server""username""password");
$db mysql_select_db("your_database"$connect);

$ip $_SERVER['REMOTE_ADDR'];
$comment_id $_POST['comment_id'];

$q =  mysql_query("SELECT * FROM comments WHERE comment_id='$comment_id' AND ip='$ip'");
$n mysql_num_rows($q);

if(
$n){
    
mysql_query("DELETE FROM comments WHERE comment_id='$comment_id' AND ip='$ip'");
} else {
    echo 
'Error deleting comment';
}

?>
Views: 402 Likes: 5 Dislikes: 1






dscsdcsdc
dscsdc

Friday, May 18, 2012 at 11:24:09 PM
dfg
Comment...lmkhj

Sunday, May 13, 2012 at 3:02:08 AM
dfg
Comment...fgjfhgjhgj

Sunday, May 13, 2012 at 3:01:54 AM
dfg
hgjffgjh

Sunday, May 13, 2012 at 3:01:50 AM
test
test sdgsdf

Saturday, April 28, 2012 at 2:48:27 AM
1 2 Next Last