Hi, I want to display the data from my database and avoid duplicate data on the page. But, I’m getting difficullt to use JSON to do that.How can I do to display the data using JSON encode function.
<script>
function show_messages()
{
$.ajax({
url: "index.php",
cache: false,
success: function(html){
$("#table_content").html(html);
}
});
}
function clean_form() {
$("#user").val('name');
$("#text").val('comment');
}
$(document).ready(function(){
// show_messages();
});
</script>
<script>
function DeleteComment(number) {
$.ajax({
type: "POST",
url: "action.php",
data: "user=1"+"&text="+number+"&ParentId=1"+"&action=delete",
success: function(html){
// show_messages();
}
});
}
function AnswerComment (id) {
$.ajax({
type: "POST",
url: "index.php",
data: "AnswerId="+id,
success: function(html){
$("#table_content").html(html);
}
});
}
function SendComment (){
var user1 = $("#user").val();
var text1 = $("#text").val();
var ParentId1 = $("#ParentId").val() + "";
$.ajax({
type: "POST",
url: "action.php",
data: "user="+user1+"&text="+text1+"&ParentId="+ParentId1+"&action=add",
success: function(html){
// show_messages();
// clean_form();
}
});
return false;
}
</script>
<?php
function ShowForm($AnswerCommentId) {
?>
<form id="myForm" action="">
<input id="user" name="user" value="name" autocomplete="off"
onfocus="if(this.value == 'name'){this.value = ''}"
onblur="if(this.value == ''){this.value = 'name'}"/>
<textarea id='text' name='text' value="comment"
onfocus="if(this.value == 'comment'){this.value = ''}"
onblur="if(this.value == ''){this.value = 'comment'}" ></Textarea>
<input id="ParentId" name="ParentId" type="hidden" value="<?php echo($AnswerCommentId);?>"/>
<button type='button' OnClick=SendComment()>Comment</button>
</form>
<br/>
<?php
}
include ("db_connect.php");
$query="SELECT * FROM `comments` ORDER BY id ASC";
$result = mysql_query($query);
if (isset($_REQUEST['AnswerId'])){
$AnswerId = $_REQUEST['AnswerId'];
} else { $AnswerId = 0; }
$i=0;
while ($mytablerow = mysql_fetch_row($result))
{
$mytable[$i] = $mytablerow; $i++;
}
function tree($treeArray, $level, $pid = 0) {
global $AnswerId;
if (!$treeArray) { return; }
foreach ($treeArray as $item) {
if ($item[1] == $pid) {
?>
<!-- Showing each comment with the correct indentation -->
<div class="CommentWithReplyDiv" style="margin-left:<?php echo($level * 60); ?>px">
<div class="CommentDiv">
<pre class="Message"><?php echo($item[3]); ?></pre>
<div class="User"><?php echo($item[2]); ?></div>
<div class="Date"><?php echo($item[4]); ?></div>
<?php
if ($level <= 4) { echo '<a href="" class="ReplyLink" onclick="AnswerComment(' . $item[0] . ');return false;">Reply</a>'; }
echo '<a href="" class="DeleteLink" onclick="DeleteComment(' . $item[0] . ');return false;">Delete</a>';
?> </div> <?php
if ($AnswerId == $item[0]) {
?><div id="InnerDiv"><?php
ShowForm($AnswerId);
?></div><?php
}
?> </div> <?php
echo ('<br/>');
tree($treeArray, $level + 1, $item[0]);
}
}
}
tree($mytable, 0);
?>
<a href="" id="LeaveCommentLink">leave a comment</a>
<div id="MainAnswerForm" style="display:none;"> <?php ShowForm(0);?></div>
<div id="AfterMainAnswerForm"></div>
<script>
$(document).ready(function(){
$("#LeaveCommentLink").click(function () {
$("#InnerDiv").remove();
$("#MainAnswerForm").slideToggle("normal");
return false;
});
});
</script>