Few days back i developed facebook style simple comment system.
Jquery Ajax Comment System now i have just added a delete feature to delete the records.

Step 1
Add the bellow code in index.php inside the <HEAD> tag and i am adding one more function to delete the posts and requesting the page delete.php via ajax request.
<script src="http://code.jquery.com/jquery-1.10.2.min.js"></script> <script> $(document).ready(function(){ $('.addComment').click(function(){ var element = $(this); var id = element.attr("id"); $('#commentBox'+id).slideToggle(200); $('#comment'+id).focus(); $('#comment'+id).val(''); $('#comment'+id).attr("placeholder", "Comment"); }); $('.comBtn').click(function(){ var element = $(this); var cid = element.attr("id"); var comment=$('#comment'+cid).val(); var datasend = 'com='+ comment + '&pid=' + cid; if(comment==""){ $('#comment'+cid).focus(); $('#comment'+cid).attr("placeholder", "Enter the comment.."); }else{ $.ajax({ type:"POST", url:"comment.php", data:datasend, cache:false, success:function(){ $('#comment'+cid).val(''); } }); } return false; }); $('.delete').click(function(){ var element=$(this); var did=element.attr('id'); var datadel='delete='+did; if(confirm("Are you sure you want delete this POST!")){ $.ajax({ type:"POST", url:"delete.php", data:datadel, cache:false, success:function(){ $('#post'+did).hide(); } }); } return false; }); }); </script>
Step 2
i am adding the DIV to put the delete icon and assign the ID with the php variable.<div style="float:right; margin-top:-28px; cursor:pointer;" class="delete" id="<?php echo $full['pid'];?>"> <img src="delete.png" align="absmiddle" style="width:18px;" title="Delete" /> </div> <a class="addComment" id="<?php echo $full['pid']?>">Comment</a> <div id="commentBox<?php echo $full['pid']?>" class="combox"> <form action="" method="post" name="<?php echo $full['pid']?>"> <textarea name="comment" class="comment" type="text" id="comment<?php echo $full['pid']?>" style="float:left;" placeholder="Comment"> </textarea> <input name="comBtn" class="comBtn" id="<?php echo $full['pid']?>" type="submit" value="Comment" /> </form> </div>
Step 3
Create the database-- -- Table structure for table `posts` -- CREATE TABLE IF NOT EXISTS `posts` ( `pid` int(11) NOT NULL AUTO_INCREMENT, `post` varchar(255) NOT NULL, PRIMARY KEY (`pid`) ) ENGINE=MyISAM DEFAULT CHARSET=latin1 AUTO_INCREMENT=1; -- -- Table structure for table `comments` -- CREATE TABLE IF NOT EXISTS `comments` ( `cmid` int(11) NOT NULL AUTO_INCREMENT, `pid` int(11) NOT NULL, `comment` varchar(255) NOT NULL, `date` date NOT NULL, PRIMARY KEY (`cmid`) ) ENGINE=MyISAM DEFAULT CHARSET=latin1 AUTO_INCREMENT=1; --
Live Demo Download Script
No comments :
Post a comment