Question

我想做的是使用ajax和php将我的数据库表数据放到索引页面的html表中。

我的问题是数据没有显示。有谁知道我的代码有什么问题？

HTML：

<table id="myTable2">
        <thead>
            <th>Name</th>
            <th>Age</th>
            <th>Gender</th>
            <th>Action</th>
        </thead>
        <tbody>
        </tbody>
</table>

脚本：

<script type="text/javascript">
$(document).ready(function(){
$.ajax({
url: 'process.php',
type: 'post',
data: {tag: 'getData'},
dataType: 'json',
success: function(data){
        if(data.success){
            $.each(data, function(index, record){
                if($.is_numeric(index)){
                    var row = $("<tr />");
                    $("<td />").text(record.name).appendTo(row);
                    $("<td />").text(record.age).appendTo(row);
                    $("<td />").text(record.gender).appendTo(row);
                    $("<td />").text(record.action).appendTo(row);
                    row.appendTo('myTable2');
                }
            })
            }
        }
    });
$('#myTable2').dataTable({
        "bjQueryUI": true,
        "sPaginationType": "full_numbers"
});
});
</script>

process.php

<?php
error_reporting(-1);
ini_set('display_errors', 'On');

if(isset($_POST['tag'])){
try{

$host = "localhost";
$user = "root";
$pass = "";
$db = "test";

$dbc = new PDO("mysql:host=" . $host . ";dbname=" . $db, $user, $pass);
$dbc->setAttribute(PDO::ATTR_ERRMODE, PDO::ERRMODE_EXCEPTION);

$sql = "SELECT name, age, gender, action FROM viewtables";
$result = $dbc->prepare($sql);

if(!$result->execute()) return false;
if($result->rowCount() > 0) {
    $json = array();
    while ($row = $result->fetch()){
        $json[] = array(
            'name' => $row['name'],
            'age' => $row['age'],
            'gender' => $row['gender'],
            'action' => $row['action']
        );
    }
    $json['success'] = true;
    echo json_encode($json);
}
} catch (PDOException $e) {
    echo "Error: " .$e->getMessage();
}
}   
?>

Answer 1

至少，这个：

    row.appendTo('myTable2');

需要：

    row.appendTo('#myTable2');

因为您正在寻找id=myTable2，而不是<myTable2>代码。

尽管如西奥多的评论所述，你真的想要：

$('#myTable2 tbody').append(row);

Answer 2

正如Paul所说，你的选择器是错误的

哈希用于标识$('#myTable')
句点（。）适用于课程$('.redTable')
元素（a，li，table）$('table')
使用属性选择器$(['href="importantLink.html"'])

检查并确保PHP为您的脚本提供了一个好的对象。确保使用正确的选择器找到您的DOM元素。

$('#myTable2').find('tbody').append(row);正是您要找的

如何使用ajax和php将数据从数据库表放入html表

2 个答案: