php - Ajax 调用不填充表

Question

我正在尝试使用所谓的现代方法来填充我的表，该方法使用 Ajax 异步更新网站的各个部分。到目前为止，我已经成功地使用纯 PHP 填充了一个表。这是代码。提前感谢您提供解决此问题的提示!

function showUsersBasic(){
$.ajax({
        url: 'php_dbrequests\php_requests.php',
        type:'POST',
        dataType: 'json',
        success: function(output_string){
                $('#db-table-users').append(output_string);
            } // End of success function of ajax form
        }); // End of ajax call    }

这是 php_dbrequests\php_requests.php 中的代码

<?php
require 'database.php';
$sql = "SELECT id, email, regdate FROM users";
$records = $conn->prepare( $sql );
$records->execute();
$results = $records->fetchAll( PDO::FETCH_ASSOC );
    $output_string = '';
    $output_string .=  '<table>';
    $output_string .= '<tr>';
    $output_string .= '<th>ID</th>';
    $output_string .= '<th>Email</th>';
    $output_string .= '<th>Register Date</th>';
    $output_string .= '</tr>';
foreach( $results as $row ){
    $output_string .=  "<tr><td>";
    $output_string .=  $row['id'];
    $output_string .=  "</td><td>";
    $output_string .=  $row['email'];
    $output_string .=  "</td><td>";
    $output_string .=  $row['regdate'];
    $output_string .=  "</td><td>";
    $output_string .=  "</td>";
    $output_string .=  "</tr>";
}
    $output_string .= '</table>';
echo json_encode($output_string);?>

我知道我了解了最基本的内容:我的数据库连接成功，调用 ajax 函数的按钮有效。我仔细检查了我对我的表的引用。请提供任何提示，我们将不胜感激!

Answer 1

您需要修改您的 PHP 代码以返回一个包含一些键的数组，例如 data 并且不要返回 table 因为您已经有一个 table在你的 html 中。所以只需返回带有填充数据的 tr。

<?php
require 'database.php';
$sql = "SELECT id, email, regdate FROM users";
$records = $conn->prepare( $sql );
$records->execute();
$results = $records->fetchAll( PDO::FETCH_ASSOC );
    $output_string = '';
    #$output_string .=  '<table>';
    $output_string .= '<tr>';
    $output_string .= '<th>ID</th>';
    $output_string .= '<th>Email</th>';
    $output_string .= '<th>Register Date</th>';
    $output_string .= '</tr>';
foreach( $results as $row ){
    $output_string .=  "<tr><td>";
    $output_string .=  $row['id'];
    $output_string .=  "</td><td>";
    $output_string .=  $row['email'];
    $output_string .=  "</td><td>";
    $output_string .=  $row['regdate'];
    $output_string .=  "</td><td>";
    $output_string .=  "</td>";
    $output_string .=  "</tr>";
}
    #$output_string .= '</table>';
echo json_encode(array('data'=>$output_string) );?>

然后将您的 ajax 代码修改为:

function showUsersBasic(){

            console.info('showUserBasic called');  

  $.ajax({
    url: 'php_dbrequests\php_requests.php',
    type:'POST',
    dataType: 'json',
    success: function(output_string){
            //OPEN FIREFOX FIREBUG EXTENSION & check console and click the ajax request to see its response
            console.log(output_string);           

            $('#db-table-users').append(output_string.data);
        } // End of success function of ajax form
    }); // End of ajax call   
 }