重新加载php生成的表而不刷新页面

时间:2018-02-11 21:20:14

标签: php jquery html

我在HTML中创建一个通过PHP代码生成的表:

<table class="table table-hover">
  <thead>
    <tr>
      <td>#</td>
      <td>name</td>
      <td>specie</td>
      <td>client</td>
      <td>status</td>
      <td>action</td>
    </tr>
  </thead>
  <body>
    <?php
      foreach($sortedPatients as $patient){
        echo "<tr><td>" . $patient['patient_id'] . "</td><td>" . $patient['patient_name'] . "</td>";
        foreach($species as $specie){
          if($specie['species_id'] == $patient['species_id']){
            echo "<td>" . $specie['species_description'] . "</td>";
          }
        }
        foreach($clients as $client){
          if($client['client_id'] == $patient['client_id']){
            echo "<td>" . $client['client_firstname'] . $client['client_lastname'] . "</td>";
          }
        }
        echo "<td>" . $patient['patient_status'] . "</td><td><i class='glyphicon glyphicon-pencil icon'></i><i class='glyphicon glyphicon-trash icon'></i></td></tr>";
      }
    ?>
  </body>
</table>

这完全有效,但现在我更改了数据($ sortedPatients),表格不会改变。有没有办法更新此表,以便显示新数据?

我尝试使用jQuery从不同的文件加载表,并使用JavaScript setInterval每秒执行此操作。但是它并不想接收主文件中加载的子文件中的数据

1 个答案:

答案 0 :(得分:1)

这里的答案是,您无法使用PHP刷新页面而无需重新加载页面。您将需要使用JavaScript或其中一个框架来操作DOM。 JQuery是实现这一目标的好方法。

您可以这样做:

$.ajax({
  type: "POST",
  url: "yourscript.php",
  data: params,
  success: function(response) {
    // Do stuff with the JSON data to update your table.
    // Since you don't have classes / ids in your html rows or columns,
    // You can do something like $('tbody').html(""); to clear all of 
    // tBody children and then rebuild your table in JavaScript.
    // This is messy and there are better ways of handling this.
  },
  error: function(errors) {
    console.log(errors);
  }
});

您可以做的另一件事是学习数据模型绑定JS框架,如Vue,Knockout,React或Angular。对于像你想要完成的事情一样简单,Vue将是最快最容易学习的。

请查看以下示例weblessonitsolutionstuff