实时更新，无需刷新页面

我想知道如何使我的PHP网页/表更新本身自动实时自动，而无需刷新页面的解决方案。该页面工作得很好。实时更新，无需刷新页面

例如，如果用户提交数据，该页面将自动更新以自动显示新的用户数据。我做了研究，涉及到ajax。我尝试了一些尝试，但它弄乱了页面。任何援助将受到赞赏。

<html> 
<head> 
<title>Seminar Overview</title> 
</head> 
    <h1><center>Seminar Overview</center> 
    <body background="cloud.png"> 

<h4><p><a href="add.php">Create Seminar</a></p><h4> 
    <h4><p><a href="index.php">Admin Login</a></p><h4> 
    <center> 
    <?php 
    //DISABLE ERRORS 
     error_reporting(E_ERROR); 
     //ESTABLISH DATABASE SERVER CONNECTION 
     $con = mysql_connect ("194.81.104.22", "", ""); 
    if (!$con) { 
    die("Can not connect: " . mysql_error()); 
} 
//MYSQL QUERY & DATABASE SCHEMA 
mysql_select_db("db12408543", $con); 
$sql = "SELECT * FROM Register"; 
$seminaroverview = mysql_query($sql,$con); 
    $data = mysql_query($sql,$con); 
//TABLE 
echo "<table border=4 table width=1000> 
<tr> 
<th>Student ID</th> 
<th>Name</th> 
    <th>Surname</th> 
    <th>Telephone</th> 
     <th>Address</th> 
     <th>Date of Registration</th> 
     <th>Email</th> 
      <th>Registered Seminar(s)</th> 
       </tr>"; 


    //MYSQL DATA TO BE DISPLAYED THROUGH PHP TABLE 
     while($record = mysql_fetch_array($data)) { 
     echo "<tr>"; 
     echo "<td>" . $record['idRegister'] . "</td>"; 
      echo "<td>" . $record['Name'] . "</td>"; 
     echo "<td>" . $record['Surname'] . "</td>"; 
      echo "<td>" . $record['Telephone'] . "</td>"; 
     echo "<td>" . $record['Address'] . "</td>"; 
      echo "<td>" . $record['Dateofregistration'] . "</td>"; 
      echo "<td>" . $record['email'] . "</td>"; 
        echo "<td>" . $record['SeminarAttended'] . "</td>"; 
        echo "</tr>"; 
         } 
      echo "</table>"; 

        mysql_close($con); 

          ?> 
          </center> 
          </body> 
         </html>

实时试图

<script type="text/javascript" src="http://code.jquery.com/jquery-1.10.1.min.js"></script> 
    <script> 
      $(document).ready(function() { 
       setInterval(function() { // set Interval function to carry out same operation in the time specified 
        $('#main').load('seminar-overview.php #main > *'); // Reloads 'seminar-overview.php' table every 6 seconds as <div> tag is specified and closed after table 
      }, 6000); 
       }); 
    </script>

来源

2015-04-01 Glenn Yemoh

本示例中没有javascript或ajax。如果您希望人们提供帮助，您需要提供一些您已尝试过的示例 – nomistic 2015-04-01 18:10:04

AngularJS将允许您使用SPA的单页应用程序，并且不需要刷新页面以进行更改。它通过$ digest通过DOM层次结构的“双向数据绑定”完成。 – user1789573 2015-04-01 18:10:42

您可以[在Ajax中进行长轮询]（http://techoctave.com/c7/posts/60-simple-long-polling-example-with-javascript-and-jquery）或者使用类似'Node.JS '做实时更新 – D4V1D 2015-04-01 18:11:34

OK，等你以后填充表格的第一次，你需要通过Ajax请求表单数据发送到另一个PHP页面。下面的示例js代码（使用jQuery）将从名为#updatePage的表单执行一个带有POST变量的新PHP页面。然后它会将表格内容设置为页面输出。那就是：

$('#updatePage').submit(function(event) { 
    event.preventDefault(); 
    var form = $(this); 

    $.ajax({ 
     url: "/path/to/script.php", 
     data: form.serialize(), 
     type: 'post', 
     dataType: 'html', 
     success: function(data) { 
      $('table').html(data); 
     }, 
     error: function(xhr, status) { 
      alert("Sorry, there was a problem!"); 
     }, 
    }); 
});

的script.php的可能是这个样子：

<?php 
$newData = //MySQL functions to get data using POST vars 

echo " 
    <tr> 
     <td>" . $newData . "</td> 
    </tr> 
"; 
?>

这是基本的想法，你应该可以修改代码以使这项工作。

来源

2015-04-01 18:22:38

除了使用'ajax'向另一个脚本发送请求，我们不能使用Jquery函数'$ .post（url [，data] [，success] [，dataType]）''吗？ – Ikari 2015-04-01 18:27:04

是的，如果你看看[jQuery文档]（https://api.jquery.com/jquery.post/），它说'$ .post'是“一个简短的Ajax函数”，并且简单地设置了ajax调用为你。 – 2015-04-01 18:31:29

是的！我使用它，因为它简化了一切。但我也认为AJAX提供了很多功能！ – Ikari 2015-04-01 18:34:59

实时更新，无需刷新页面

回答

相关问题