How can I display the data using Ajax and JSON encode

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>

This topic was automatically closed 91 days after the last reply. New replies are no longer allowed.