Sunday, July 24, 2011

ADD REPLY FUNCTIONALITY TO OUR COMMENT SYSTEM part2

this page post.php
<?php include_once "mysql.php";
if ($_POST['wall'] == "post"){
$name = $_POST['name1'];//name1 is parameter from the jquery function 
$comment = $_POST['comment1'];//comment1 is parameter from the jquery function  
if ($comment=="" || $name==""){exit();}// if no name or comment exit the script
else{
//insert the name and comment into database 
$sql = mysql_query("INSERT INTO comment (name,comment) VALUES('$name','$comment')")
or die (mysql_error()); 
$id = mysql_insert_id();//the auto incremented id of the commet.
it important to this line  
// the inserted comment will renderd by the "$("#result").prepend(data).show();" from jquery
echo 'name : '.$name.'<br />comment : '.$comment.'<br />
<div id="'.$id.'" class="reply"><span>reply</span><hr>name<br />
<input type="text" id="repname'.$id.'" />
<br />
comment<br />
<textarea id="repcomment'.$id.'" cols="30" rows="2"></textarea>
<br />
<input type="submit" name="button" id="button" value="Submit" 
onclick="return false" onmousedown="javascript:reply('.$id.');"/></form>

<br />' . $r . '</div> <hr>';
} } else if ($_POST['wall'] == "reply"){
$repto = $_POST['repto1'];//repto1 is parameter from the jquery function  
$repname = $_POST['repname1'];//repname1 is parameter from the jquery function  
$repcomment = $_POST['repcomment1'];//repcomment1 is parameter from the jquery function  

if ($repcomment=="" || $repname==""){exit();}// if no $repname or $repcomment exit the script
else{
//insert the values above into database 
$sql = mysql_query("INSERT INTO reply (repto,repname,repcom) VALUES($repto,'$repname','$repcomment')")
or die (mysql_error());  
// the inserted reply will renderd by the "$("#"+ comid).append(data);" from jquery
echo 'name : '.$repname.'<br />comment : '.$repcomment.'<hr>';
}
} ?>

ADD REPLY FUNCTIONALITY TO OUR COMMENT SYSTEM part1

continuing from http://phpcoderboard.blogspot.com/2011/06/learn-how-to-create-comment-system-with.html
first create a table and call it "reply" with 4 fields rid, repto, 
repname, repcom.
this page index.php
<?php
include_once "mysql.php";
//////render data that is already stored in the data base
$sql_comments = mysql_query("SELECT * FROM comment ORDER BY id DESC");
while($row = mysql_fetch_array($sql_comments)){
$id = $row["id"];
$name = $row["name"];
$comment = $row["comment"];


$sql_hreply = mysql_query("SELECT * FROM reply WHERE repto !='$id'" );
while($row = mysql_fetch_array($sql_hreply)){
$r = "";
}
$sql_reply = mysql_query("SELECT * FROM reply WHERE repto='$id'" );
while($row = mysql_fetch_array($sql_reply)){
$replycom = $row["repcom"];
$replyname = $row["repname"];
$r .= 'name : '.$replyname.'<br />comment : '.$replycom.'<hr>' ;


}  
$commentlist .= 'name : '.$name.'<br />comment : '.$comment.'<br /> <div id="'.$id.'" class="reply"><span>reply</span><hr>name<br />
<input type="text" id="repname'.$id.'" />
<br />
comment<br />
<textarea id="repcomment'.$id.'" cols="30" rows="2"></textarea>
<br />
<input type="submit" name="button" id="button" value="Submit" 
onclick="return false" onmousedown="javascript:reply('.$id.');"/></form>
<br />' . $r . '</div> <hr>';
}
//////////////the highlight is new code added to old script
?>
<script type="text/javascript" src="js/jquery-1.4.2.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$('#loading').hide();
$('#notice').hide();
}); function wall(){
$('#loading').show();
var name = $('#name').val();///#name is the input id and will be equal the variable "name"
var comment = $('#comment').val();/////#comment is textarea id and will be equal the variable "comment"
var URL = "post.php"; /////post.php will be equal the variable "URL" $.post(URL,{wall:"post",name1:name,comment1:comment},function(data){
//parameter wall will be equal "post", name1 will be equal to the var "name" and comment1 will be equal to the var "comment"
$("#result").prepend(data);//.show() the result will be placed above the the #result div
$('#loading').hide();
var name = $('#name').val("");
var comment = $('#comment').val("");
});
} function reply(comid){  
var repname = $('#repname'+comid).val();///#repname is the input id and will be equal the variable "name"
var repcomment = $('#repcomment'+comid).val();/////#repcomment is textarea id and will be equal the variable "comment"
alert(comid + "" + repname + " " + repcomment) var URL = "post.php"; /////post.php will be equal the variable "comment"
$.post(URL,{wall:"reply",repname1:repname,repcomment1:repcomment,repto1:comid},function(data){

//parameter wall will be equal "post", repname1 will be equal to the var "repname" and repcomment1 will be equal to the var "repcomment"
$("#"+ comid).append(data);//render result
//$('#loading').hide();
var repname = $('#repname'+comid).val("");
var repcomment = $('#repcomment'+comid).val("");
});
}  
</script>


<style type="text/css">
<!--
#notice {
font-family: Arial, Helvetica, sans-serif;
font-size: 12px;
font-weight: normal;
color: #660000;
background-color: #FFF2F2;
padding: 5px;
border: 1px solid #FF6666;
text-align: center;
}
.reply {
margin-left: 50px;
}
span{
font-size: 14px;
font-weight: bold;
color: #333333;
}
-->
</style>  
<table width="500" border="0" align="center" cellpadding="0" cellspacing="0">
<tr>
<td><form>
name<br />
<input type="text" id="name" />
<br />
comment<br />
<textarea id="comment" cols="45" rows="5"></textarea> <br />
<input type="submit" name="button" id="button" value="Submit" onclick="return false" onmousedown="javascript:wall();"/>
<img src="loading.gif" alt="" width="15" height="15" id="loading" />
<br /></form>
<div id="notice">Your comment will be reviewed by the webmaster before publishing</div>
<div id="result"><?php print"$commentlist";?></div></td>
</tr>