使用AJAX调用表

问题描述 投票:0回答:1

所以我试图在用户点击图像时显示一个表格。我走得很远,但我陷入困境,似乎无法找到我的错误。

当我打开我的控制台时,我收到以下错误:

enter image description here

现在Hannibal是我想要在表格中显示的用户组的一部分。

我不会发布整个代码,因为它很多。我试着把它保存到相关部分。在这种情况下,我知道我进入了执行查询的.php文件。

由于我测试了查询,我知道它有效,所以我只是展示我如何在单独的.php文件中将其返回:

$Guest_Invite_Data = filterTable($List_Guests_Query);
$Guest_Invite_Data_fetched = mysqli_fetch_array($Guest_Invite_Data);

echo json_encode($Guest_Invite_Data_fetched);

function filterTable($query)  
{   
    $filter_Result = mysqli_query($GLOBALS['connect'], $query);
    return $filter_Result;
}    

这是我的jQuery的一部分:

success:function(Guest_Invite_Data_fetched) {
    createTableByJqueryEach2(Guest_Invite_Data_fetched);
},

继承我的职责:

function createTableByJqueryEach2(data2){

    var eTable2="<table><tr><th colspan='5'>Gäste einladen</th></tr><tr><th>Person</th></tr>"
    $.each(data2,function(index2, row2){

        eTable2 += "<tr>";
        $.each(row2,function(key2,value2){
            eTable2 += "<td>"+value2+"</td>";
        });
     eTable2 += "</tr>";
    });
    eTable2 +="</table>";
    $('#guest_table').html(eTable2);
 }

有人发现我的错误吗?

编辑:按要求输出的图片

enter image description here

编辑2:输出的文本按要求

Array ( [0] => Hannibal [firstname] => Hannibal [1] => Lecter [lastname] => Lecter [2] => Cannibals Inc. [name] => Cannibals Inc. ) {"0":"Hannibal","firstname":"Hannibal","1":"Lecter","lastname":"Lecter","2":"Cannibals Inc.","name":"Cannibals Inc."}
php jquery ajax
1个回答
3
投票

使用以下作为测试代码,我发现两件事:

一个。您从数据库中获取索引和关联数组。在JSON中注意编号的索引和值,后跟关联(列名)和值:

"0":"Hannibal","firstname":"Hannibal"

你应该只获取你想要的东西。例如,我在这里使用mysqli_fetch_assoc() - 给我列名称和值。

湾您循环遍历数据,然后尝试循环生成的文本:,这是导致错误的原因。例如,第一次迭代的row2包含值Hannibal,所以你第二次循环基本上是试图这样做:

$.each('Hannibal',function(key2,value2){...

Hannibal,只是文本,不能像这样循环。它没有关键或价值。

您只需要一个循环来获取此数据。以下是证明这一点的测试代码:

var guest_data =  {"0":"Hannibal","firstname":"Hannibal","1":"Lecter","lastname":"Lecter","2":"Cannibals Inc.","name":"Cannibals Inc."};

function createTableByJqueryEach2(data2){

    var eTable2="<table><tr><th colspan='5'>Gäste einladen</th></tr><tr><th>Person</th></tr>"
    $.each(data2,function(index2, row2){

        eTable2 += "<tr>";
        eTable2 += "<td>"+row2+"</td>";
        eTable2 += "</tr>";
    });
    eTable2 +="</table>";
    $('#guest_table').html(eTable2);
 }

 createTableByJqueryEach2(guest_data);

这导致以下结果:

<div id="guest_table">
    <table>
        <tbody>
            <tr>
                <th colspan="5">Gäste einladen</th>
            </tr>
            <tr>
                <th>Person</th>
            </tr>
            <tr>
                <td>Hannibal</td>
            </tr>
            <tr>
                <td>Lecter</td>
            </tr>
            <tr>
                <td>Cannibals Inc.</td>
            </tr>
            <tr>
                <td>Hannibal</td>
            </tr>
            <tr>
                <td>Lecter</td>
            </tr>
            <tr>
                <td>Cannibals Inc.</td>
            </tr>
        </tbody>
    </table>
</div>

您可能希望拥有不同的布局,这正是我为证明错误所做的工作。

© www.soinside.com 2019 - 2024. All rights reserved.