自动更新HTML / PHP表以淡化新结果并使用AJAX / Javascript / jQuery淡出旧结果

Question

I'm looking for the simplest possible method to automatically update the below every X seconds to fade in new results and fade out old results.

I have searched online but everything that I have found has been extremely complex so I was wondering what would be the simplest possible method to achieve this?

  <?php

  error_reporting(E_ALL);
  ini_set('display_errors', 1);

  include('core/connection.php');

  if($conn){ 

  $stid = oci_parse($conn, "

    SELECT OrderNo, InvoiceNo
    FROM Orders
    WHERE rownum <= 5
    ORDER BY rownum DESC

  ");
  oci_execute($stid);

  echo "<table class='table table-hover '>
        <thread>
        <tr>
        <th>OrderNo</th>
        <th>InvoiceNo</th>
        <th></th>
        </tr>
        </thread>
        <tbody>";

  while ($row = oci_fetch_array($stid, OCI_ASSOC)) {

    echo "<tr>";
    echo "<td>" . $row['OrderNo'] . "</td>";
    echo "<td>" . $row['InvoiceNo'] . "</td>";
    echo "</tr>";
    unset($row);

  }

  echo "</tbody>
        </table>";

  oci_free_statement($stid);
  oci_close($conn);

  }

  ?>

Answer 1

You need to use AJAX, it's the only viable way to load new data without refreshing a page. What you've described is a common use of AJAX and there are many tutorials online, so I won't bother reinventing the wheel.

This is one that I found that teaches you how to load the data, and animate it in.