title: PHP-JQuery-Ajax: How to Populate table with all results from mysql query result (json encoded array)
body: <p>I've been trying to figure out how to load the results of a search into a table but no matter what I do, I'm only getting one single result instead of the 2 (sample size) rows that I have in the table in the db.</p>
  
  <p><strong>This is the MySQL Code:</strong></p>
  
  <pre><code>if (isset($_POST['search_value'])) {
  $search_value = mysqli_real_escape_string($conn, $_POST['search_value']);
  
  $sql = "SELECT
          record_id,
          personal_id,
          name,
          status,
          entry_date
          FROM sample_db
          WHERE EmpID = '".$search_value."'";
  
  $res = mysqli_query($conn, $sql) or die("Error: ".mysqli_error($conn));
  
  $data = array();
  while($row = mysqli_fetch_array($res)){
  $data = array(
          'tb_record_id' =&gt; $row['record_id'],
          'tb_personal_id' =&gt; $row['personal_id'],
          'tb_name' =&gt; $row['name'],
          'tb_status' =&gt; $row['status'],
          'tb_entry_date' =&gt; $row['entry_date'],
          );
          }
          echo json_encode($data);
  
  }
  </code></pre>
  
  <p>I've read several examples where the array is built as $data[] = array( data goes here) instead of $data = array(data goes here) but whenever I try $data[], it doesn't return anything to the table BUT the console log does show all the results within the array.</p>
  
  <p>also, using dataType: 'json' doesn't seem to work either.</p>
  
  <p>The only way I've tried this so far is by giving an id to each <code>&lt;td&gt;</code>.</p>
  
  <p><strong>ajax code</strong></p>
  
  <pre><code>$.ajax({
          type : 'POST',
          url  : 'search_fetch.php',
          data : data,
          cache: false,
          success :  function(response)
                  {
                  result = jQuery.parseJSON(response);                        
  
                  $("#list_p_id").append(result.tb_personal_id);
                  $("#list_name").append(result.tb_name);
                  $("#list_status").append(result.tb_status);                                     
                  $("#list_date").append(result.tb_entry_date);
       }
  });
  </code></pre>
  
  <p>How can I populate the table with all available results?</p>
  
  <p>Also in case if helps, I am open to not use an array. I just don't know another way of how to send the results of a query to an ajax response.</p>