重新加载PHP生成的表,而无需页面刷新 [英] reload php generated table without page refresh

查看:112
本文介绍了重新加载PHP生成的表,而无需页面刷新的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我正在用HTML制作表格,该表格是通过PHP代码生成的:

I'm making a table in HTML which gets generated via PHP code:

<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),表也没有改变.有没有一种方法可以更新此表,以便显示新数据?

This completely works but now I change the data ($sortedPatients) and the table won't change. Is there a way to update this table so it will show the new data?

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

I tried using jQuery to load the table from a different file and use JavaScript setInterval to do this every second. But then it didn't want to receive the data in the sub file that was loaded in the main file

推荐答案

此处的答案是,没有重新加载页面的方法,就无法使用PHP刷新页面.您将需要使用JavaScript或其框架之一来操作DOM. jQuery是完成此任务的一种好方法.

The answer here is that there is no way for you to refresh the page using PHP without reloading the page. You will need to use JavaScript or one of it's frameworks to manipulate the DOM. JQuery is an OK way of accomplishing this.

您可以执行以下操作:

$.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将是最快,最容易学习的.

Another thing you could do is learn a Data Model Binding JS framework like Vue, Knockout, React, or Angular. For something simple like what you are trying to accomplish Vue would be the fastest and easiest to learn.

看看这些示例 查看全文

登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆