Php 使用Ajax呈现html表

我想知道如何实现以下项目

实际上，我有一个php代码，它呈现一个表

<table id = "oldata" class ="table table-bordered">

    <thead>
            <tr class ="success">
                    <th class="text-center">Stage</th>
                    <th class="text-center">REQUEST</th>
                    <th class="text-center">REPLY</th>
            </tr>
        </thead>

    <tbody>
<?php

    foreach($allinfool as $infool){
        print("<tr>");
        print("<td>{$infool["Stage"]}</td>");
        print("<td class='text-left'>" .nl2br($infool["comment"])."</td>");
        print("<td class='text-left'>" .nl2br($infool["resultcom"]). "</td>");
        print("</tr>");
    }

?>
    </tbody>

</table>

到目前为止还不错，不过我想基于用户的操作构建许多类似于上面的表。 我的意思是，他会有一个选项1，选项2，选项3的列表。。。然后单击此按钮，它将在不重新加载基于新AllInfo数组的html上方的页面的情况下呈现

我的观点是，我想通过Ajax来实现。到目前为止，我可以管理Ajax，但不能呈现html的上述内容。 我可以设法渲染回一个数字或一个文本，但在本例中，由于html与php混合使用，因此更为复杂。

---

您能帮我弄清楚如何实现这种Ajax技术吗？

将您的代码放入类似table.php的文件中，然后从index.php使用Jquery调用它并呈现表格：

HTML:

---

每次单击该按钮时，它都会渲染一个附加到渲染元素的新表

谢谢您的回复，我是否应该在table.php中执行任何特殊操作来吐出hmtl？你能给我看一下吗？不，你不需要任何东西就可以按原样呈现表格，如果你从浏览器调用table.php，你会看到你将呈现什么：表格。我试过了，这正是我所期望的。谢谢——

<button id="rendertable">Render new table</button>
<div id="render"></div>

$(document).ready(function () {

    $('#rendertable').click(function () {
        $.ajax({
            url: "table.php",
            success: function (response) {
                $('#render').append(response);
            }
        });
    });

});

you need to do this code in you main file from where you want to call table.php file - 
and pass the array variable into your $allinfool variable in table.php like-
$allinfool = array();
$allinfool = $_POST['variable_value'];
You have done.

//this code is for your index.php file or any other file from where you want to call table.php
 <?php 
    $arr = array(
        array("Stage" => "Stage_value1", "comment" => "comment_value1", "resultcom" => "resultcom_value1"),
        array("Stage" => "Stage_value2", "comment" => "comment_value2", "resultcom" => "resultcom_value2"),
        array("Stage" => "Stage_value3", "comment" => "comment_value3", "resultcom" => "resultcom_value3")
    );
    $arr = json_encode($arr);
    ?>
    <button id="button">Click Me</button>
    <div id="success"></div>
    <div id="error"></div>
    <script src="https://code.jquery.com/jquery-1.10.2.js"></script>
    <script>
    $("document").ready(function(){
      $("button#button").on("click", function(){
        $( "#success" ).load( "table.php", { 'variable_value' : <?php echo $arr ?> }, function( response, status, xhr ) {
          if ( status == "error" ) {
            var msg = "Sorry but there was an error: ";
            $( "#error" ).html( msg + xhr.status + " " + xhr.statusText );
          }
        });
      });
    });
    </script>