在 php 页面加载后使用 Ajax 动态呈现 table 值

Question

我的想法是在 php 页面上获取数据库中可用服务器的连接状态。

  <tbody>
  <?php foreach ($data['servers'] as $server) { ?>
     <tr>
          <td class=""><?php echo $server->server_name; ?></td>
          <td class=""><?php echo $server->base_path; ?></td>
          <td class="server_status"><?php if (is_dir($server->base_path)){ echo 'Pass';} else { echo 'Fail' } ?></td>
    </tr>
  <?php  } ?>
  </tbody>

我想在页面加载后使用 ajax 这样做 page screenshot

如何调用 ajax 来获取这个动态生成的 table 的每个值。到目前为止，我已经尝试了以下代码

<?php foreach ($data['servers'] as $server) { ?>
     <tr>
          <td class=""><?php echo $server->server_name; ?></td>
          <td class=""><?php echo $server->base_path; ?></td>
          <td class="server_status"></td>
          <td class="server_status_loading"></td>
    </tr>
  <?php  } ?>

JS

$(function(){

$(".server_status").hide();
$(".server_status_loading").show();
$.ajax({
    url: 'get-server-status'
})
.error(function(){
    alert('Error!');
})
.done(function(response){

    $(".server_status_loading").hide();
    $(".server_status").show();
    $(".server_status").html(response);
});

获取服务器状态函数：

    public function getStatus() {

    $basep = $this->_serverModel->getBasePath(2);
    if (is_dir($basep)) { 
        echo 'Pass'; exit;
    } 
    else { 
        echo 'Fail'; exit;
    }
}

提前致谢！

Answer 1

这样试试

$(document).ready(function(){
    var hTable = document.getElementById('table2');
        var iRowCount = hTable.rows.length;

    for(var i=1; i<iRowCount; i++){
        basepath= hTable.rows[i].cells[2].childNodes[1].value;      
        $.ajax({
           url: 'get-server-status',
           data :basepath 
        })
    .error(function(){
        alert('Error!');
    })
    .done(function(response){
        hTable.rows[i].cells[2].childNodes[3].value=response;
    });

    }
}

Answer 2

首先将 id 添加到您的 <tr>。

<?php foreach ($data['servers'] as $server) { ?>
 <tr id="echo database id here.">
      <td class=""><?php echo $server->server_name; ?></td>
      <td class=""><?php echo $server->base_path; ?></td>
      <td class="server_status"></td>
      <td class="server_status_loading"></td>
</tr>

然后检查 this link to handle the ajax on page load and this link 以处理 click.Rest 上的 ajax 一切都在那里提供。

在link中您可以将status替换为server_status_loading

在 php 页面加载后使用 Ajax 动态呈现 table 值

Render table values dynamically using Ajax after page load in php

javascript

php

jquery

ajax

dynamic-tables